<!doctype html>
<html class="no-js" lang="">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <title>angular-material-app documentation</title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <link rel="icon" type="image/x-icon" href="../images/favicon.ico">
	    <link rel="stylesheet" href="../styles/style.css">
    </head>
    <body>

        <div class="navbar navbar-default navbar-fixed-top visible-xs">
            <a href="../" class="navbar-brand">angular-material-app documentation</a>
            <button type="button" class="btn btn-default btn-menu fa fa-bars" id="btn-menu"></button>
        </div>

        <div class="xs-menu menu" id="mobile-menu">
            <div id="book-search-input" role="search">
                <input type="text" placeholder="Type to search">
            </div>
            <nav>
            
                <ul class="list">
            
                    <li class="title">
                        <a href="../index.html">angular-material-app documentation</a>
                    </li>
            
                    <li class="divider"></li>
            
            
                    <li class="chapter">
                        <a data-type="chapter-link" href="../index.html"><span class="fa fa-home"></span>Getting started</a>
                        <ul class="links">
                                <li class="link">
                                    <a 
                                        
                                         href="../overview.html" 
                                         href="../overview.html" 
                                        >
                                        <span class="fa fa-th"></span>Overview
                                    </a>
                                </li>
                                <li class="link">
                                  <a href="../index.html" ><span class="fa fa-file-text-o"></span>README</a>
                                </li>
                                <li class="link">
                                        <a href="../changelog.html"
                                    >
                                        <span class="fa fa-file-text-o"></span>CHANGELOG
                                    </a>
                                </li>
                                <li class="link">
                                        <a href="../license.html"
                                    >
                                        <span class="fa fa-file-text-o"></span>LICENSE
                                    </a>
                                </li>
                        </ul>
                    </li>
            
            
                    <li class="chapter">
                        <a data-type="chapter-link" href="../modules.html" >
                            <div class="menu-toggler linked" data-toggle="collapse"
                                    data-target="#xs-modules-links"
                            >
                                <span class="fa fa-archive"></span>
                                <span class="link-name">Modules</span>
                                <span class="fa fa-angle-down"></span>
                            </div>
                        </a>
                        <ul class="links collapse "
                                id="xs-modules-links"
                            >
                                <li class="link">
                                    <a href="../modules/AdminModule.html" >AdminModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/AmpaModule.html" >AmpaModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/AnalysisModule.html" >AnalysisModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/AnalysisRoutingModule.html" >AnalysisRoutingModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/ApmModule.html" >ApmModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/ApmRoutingModule.html" >ApmRoutingModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/AppModule.html" >AppModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/AppRoutingModule.html" >AppRoutingModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/BaseLayoutModule.html" >BaseLayoutModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/ButtonModule.html" >ButtonModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/ChartModule.html" >ChartModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/ChartRoutingModule.html" >ChartRoutingModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/ChatRoutingModule.html" >ChatRoutingModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/ChatsModule.html" >ChatsModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/ComponentModule.html" >ComponentModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/CoreModule.html" >CoreModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/CrmModule.html" >CrmModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/CrmRoutingModule.html" >CrmRoutingModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/DatePickerModule.html" >DatePickerModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/FileUploadModule.html" >FileUploadModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/FireBaseComponentsModule.html" >FireBaseComponentsModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/FormModule.html" >FormModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/FormsRoutingModule.html" >FormsRoutingModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/HeaderModule.html" >HeaderModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/HomeModule.html" >HomeModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/HomeRoutingModule.html" >HomeRoutingModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/LoadingModule.html" >LoadingModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/MailModule.html" >MailModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/MailRoutingModule.html" >MailRoutingModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/MaterialComponentsModule.html" >MaterialComponentsModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/MaterialsModule.html" >MaterialsModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/MaterialsRoutingModule.html" >MaterialsRoutingModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/NavigationModule.html" >NavigationModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/NavigationModule.html" >NavigationModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/NavigationRoutingModule.html" >NavigationRoutingModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/NotificaitonModule.html" >NotificaitonModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/NotificationContainerModule.html" >NotificationContainerModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/PageLayoutsModule.html" >PageLayoutsModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/PageLayoutsRoutingModule.html" >PageLayoutsRoutingModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/PagesModule.html" >PagesModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/PagesRoutingModule.html" >PagesRoutingModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/SearchModule.html" >SearchModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/SharedModule.html" >SharedModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/SidenavModule.html" >SidenavModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/TablesModule.html" >TablesModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/TablesRoutingModule.html" >TablesRoutingModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/TodoModule.html" >TodoModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/TodoRoutingModule.html" >TodoRoutingModule</a>
                                </li>
                                <li class="link">
                                    <a href="../modules/WidgetModule.html" >WidgetModule</a>
                                </li>
                        </ul>
                    </li>
            
                    <li class="chapter">
                        <div class="simple menu-toggler" data-toggle="collapse"
                                data-target="#xs-components-links"
                            >
                            <span class="fa fa-cogs"></span>
                            <span>Components</span>
                            <span class="fa fa-angle-down"></span>
                        </div>
                        <ul class="links collapse "
                                id="xs-components-links"
                            >
                                <li class="link">
                                    <a href="../components/AboutComponent.html" >AboutComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/AdminComponent.html" >AdminComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/AgeComponent.html" >AgeComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/AmapComponent.html" >AmapComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/AmapComponent.html" >AmapComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/AppComponent.html" >AppComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/BarComponent.html" >BarComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/BaseLayoutComponent.html" >BaseLayoutComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/BlogComponent.html" >BlogComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/BrandComponent.html" >BrandComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/BrandComponent.html" >BrandComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ButtonComponent.html" >ButtonComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ButtonsComponent.html" >ButtonsComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/CalendarComponent.html" >CalendarComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/CalendarComponent.html" >CalendarComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/CardsComponent.html" >CardsComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ChartComponent.html" >ChartComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ChatComponent.html" >ChatComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ChatsComponent.html" >ChatsComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ComposeComponent.html" >ComposeComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ConsumerComponent.html" >ConsumerComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ContactComponent.html" >ContactComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ContactComponent.html" >ContactComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ContactUpdateComponent.html" >ContactUpdateComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ContactsComponent.html" >ContactsComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ContractComponent.html" >ContractComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/CrmComponent.html" >CrmComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/CrowdComponent.html" >CrowdComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/CustomerCommonComponent.html" >CustomerCommonComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/CustomerComponent.html" >CustomerComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/CustomizerComponent.html" >CustomizerComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/DashboardComponent.html" >DashboardComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/DatatableComponent.html" >DatatableComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/DateDisplayComponent.html" >DateDisplayComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/DatePickerComponent.html" >DatePickerComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/DatePickerComponent.html" >DatePickerComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/DayButtonComponent.html" >DayButtonComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/DetailComponent.html" >DetailComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/DetailComponent.html" >DetailComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/DialogsComponent.html" >DialogsComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/DoughnutComponent.html" >DoughnutComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/DynamicComponent.html" >DynamicComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/EditorComponent.html" >EditorComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ElementsComponent.html" >ElementsComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/EquipmentBrandComponent.html" >EquipmentBrandComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/EquipmentComponent.html" >EquipmentComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ErrorComponent.html" >ErrorComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/FileManagerComponent.html" >FileManagerComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/FileUploadComponent.html" >FileUploadComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/FooterComponent.html" >FooterComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/FormsComponent.html" >FormsComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/FullwidthComponent.html" >FullwidthComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/GenderComponent.html" >GenderComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/HeaderComponent.html" >HeaderComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/HomeComponent.html" >HomeComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/IconComponent.html"  data-type="entity-link" class="active" >IconComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ItemComponent.html" >ItemComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/LeadComponent.html" >LeadComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/LineComponent.html" >LineComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ListComponent.html" >ListComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ListsComponent.html" >ListsComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/LoadingComponent.html" >LoadingComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/MailComponent.html" >MailComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/MarkdownComponent.html" >MarkdownComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/MenuComponent.html" >MenuComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/MonthComponent.html" >MonthComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/NavCollapseComponent.html" >NavCollapseComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/NavItemComponent.html" >NavItemComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/NavigationComponent.html" >NavigationComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/NavigationComponent.html" >NavigationComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/NoticeComponent.html" >NoticeComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/NotificationComponent.html" >NotificationComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/OperatorsComponent.html" >OperatorsComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/OpportunitiesComponent.html" >OpportunitiesComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/PagesComponent.html" >PagesComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/PaginationComponent.html" >PaginationComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/PaginationComponent.html" >PaginationComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/PerformanceComponent.html" >PerformanceComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/PermeabilityComponent.html" >PermeabilityComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/PieComponent.html" >PieComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/PolarComponent.html" >PolarComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/PopoverComponent.html" >PopoverComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/PopoverComponent.html" >PopoverComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/PopulationComponent.html" >PopulationComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/PreferenceComponent.html" >PreferenceComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/PreferenceFieldComponent.html" >PreferenceFieldComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ProductComponent.html" >ProductComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ProfileComponent.html" >ProfileComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ProjectComponent.html" >ProjectComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/RadarComponent.html" >RadarComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/RegionComponent.html" >RegionComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ScenePortraitComponent.html" >ScenePortraitComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/SearchComponent.html" >SearchComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ServicesComponent.html" >ServicesComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/SidenavComponent.html" >SidenavComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/SigninComponent.html" >SigninComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/SignupComponent.html" >SignupComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/SliderComponent.html" >SliderComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/StateComponent.html" >StateComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/StaticComponent.html" >StaticComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/SwitchComponent.html" >SwitchComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/TableComponent.html" >TableComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/TablesComponent.html" >TablesComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/TabsComponent.html" >TabsComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ToastComponent.html" >ToastComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/TodoComponent.html" >TodoComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/TodoHeaderComponent.html" >TodoHeaderComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/TodoItemComponent.html" >TodoItemComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/TodoListComponent.html" >TodoListComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/TodoSearchComponent.html" >TodoSearchComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/TodoSidenavComponent.html" >TodoSidenavComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/TodoToolbarComponent.html" >TodoToolbarComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ToolbarComponent.html" >ToolbarComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ToolbarComponent.html" >ToolbarComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ToolbarHelpComponent.html" >ToolbarHelpComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ToolbarNotificationComponent.html" >ToolbarNotificationComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ToolbarUserComponent.html" >ToolbarUserComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/TooltipsComponent.html" >TooltipsComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/UserComponent.html" >UserComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ValidationComponent.html" >ValidationComponent</a>
                                </li>
                                <li class="link">
                                    <a href="../components/ViewComponent.html" >ViewComponent</a>
                                </li>
                        </ul>
                    </li>
            
                    <li class="chapter">
                        <div class="simple menu-toggler" data-toggle="collapse"
                                data-target="#xs-directives-links"
                            >
                            <span class="fa fa-code"></span>
                            <span>Directives</span>
                            <span class="fa fa-angle-down"></span>
                        </div>
                        <ul class="links collapse "
                                id="xs-directives-links"
                            >
                                <li class="link">
                                    <a href="../directives/ButtonDirective.html" >ButtonDirective</a>
                                </li>
                                <li class="link">
                                    <a href="../directives/FileUploadDirective.html" >FileUploadDirective</a>
                                </li>
                                <li class="link">
                                    <a href="../directives/LoadingDirective.html" >LoadingDirective</a>
                                </li>
                                <li class="link">
                                    <a href="../directives/NotificationContainerDirective.html" >NotificationContainerDirective</a>
                                </li>
                                <li class="link">
                                    <a href="../directives/PopoverDirective.html" >PopoverDirective</a>
                                </li>
                        </ul>
                    </li>
            
                    <li class="chapter">
                        <div class="simple menu-toggler" data-toggle="collapse"
                                data-target="#xs-classes-links"
                            >
                            <span class="fa fa-file-code-o"></span>
                            <span>Classes</span>
                            <span class="fa fa-angle-down"></span>
                        </div>
                        <ul class="links collapse "
                                id="xs-classes-links"
                            >
                                <li class="link">
                                    <a href="../classes/Chat.html" >Chat</a>
                                </li>
                                <li class="link">
                                    <a href="../classes/NavigationModel.html" >NavigationModel</a>
                                </li>
                                <li class="link">
                                    <a href="../classes/NotificationConfig.html" >NotificationConfig</a>
                                </li>
                                <li class="link">
                                    <a href="../classes/NotificationInjector.html" >NotificationInjector</a>
                                </li>
                                <li class="link">
                                    <a href="../classes/NotificationRef.html" >NotificationRef</a>
                                </li>
                                <li class="link">
                                    <a href="../classes/SidenavItem.html" >SidenavItem</a>
                                </li>
                                <li class="link">
                                    <a href="../classes/Todo.html" >Todo</a>
                                </li>
                                <li class="link">
                                    <a href="../classes/ToolbarNotificationModel.html" >ToolbarNotificationModel</a>
                                </li>
                                <li class="link">
                                    <a href="../classes/Upload.html" >Upload</a>
                                </li>
                        </ul>
                    </li>
            
                    <li class="chapter">
                        <div class="simple menu-toggler" data-toggle="collapse"
                                data-target="#xs-injectables-links"
                            >
                            <span class="fa fa-long-arrow-down"></span>
                            <span>Injectables</span>
                            <span class="fa fa-angle-down"></span>
                        </div>
                        <ul class="links collapse "
                                id="xs-injectables-links"
                            >
                                <li class="link">
                                    <a href="../injectables/AnalysisService.html" >AnalysisService</a>
                                </li>
                                <li class="link">
                                    <a href="../injectables/ApmService.html" >ApmService</a>
                                </li>
                                <li class="link">
                                    <a href="../injectables/AuthService.html" >AuthService</a>
                                </li>
                                <li class="link">
                                    <a href="../injectables/ChatsService.html" >ChatsService</a>
                                </li>
                                <li class="link">
                                    <a href="../injectables/ConfigService.html" >ConfigService</a>
                                </li>
                                <li class="link">
                                    <a href="../injectables/DataTableService.html" >DataTableService</a>
                                </li>
                                <li class="link">
                                    <a href="../injectables/FileManagerFirebase.html" >FileManagerFirebase</a>
                                </li>
                                <li class="link">
                                    <a href="../injectables/FileUploadService.html" >FileUploadService</a>
                                </li>
                                <li class="link">
                                    <a href="../injectables/LeadService.html" >LeadService</a>
                                </li>
                                <li class="link">
                                    <a href="../injectables/MailService.html" >MailService</a>
                                </li>
                                <li class="link">
                                    <a href="../injectables/NavigationService.html" >NavigationService</a>
                                </li>
                                <li class="link">
                                    <a href="../injectables/NavigationService.html" >NavigationService</a>
                                </li>
                                <li class="link">
                                    <a href="../injectables/NotificationService.html" >NotificationService</a>
                                </li>
                                <li class="link">
                                    <a href="../injectables/SidenavService.html" >SidenavService</a>
                                </li>
                                <li class="link">
                                    <a href="../injectables/TodoService.html" >TodoService</a>
                                </li>
                                <li class="link">
                                    <a href="../injectables/ToolbarNotificationService.html" >ToolbarNotificationService</a>
                                </li>
                                <li class="link">
                                    <a href="../injectables/UserService.html" >UserService</a>
                                </li>
                        </ul>
                    </li>
            
            
                    <li class="chapter">
                        <div class="simple menu-toggler" data-toggle="collapse"
                                data-target="#xs-interfaces-links"
                            >
                            <span class="fa fa-info"></span>
                            <span>Interfaces</span>
                            <span class="fa fa-angle-down"></span>
                        </div>
                        <ul class="links collapse "
                                id="xs-interfaces-links"
                            >
                                <li class="link">
                                    <a href="../interfaces/Activate.html" >Activate</a>
                                </li>
                                <li class="link">
                                    <a href="../interfaces/IMapAPILoaderConfig.html" >IMapAPILoaderConfig</a>
                                </li>
                                <li class="link">
                                    <a href="../interfaces/LoadingInterface.html" >LoadingInterface</a>
                                </li>
                                <li class="link">
                                    <a href="../interfaces/NotificationIconClasses.html" >NotificationIconClasses</a>
                                </li>
                                <li class="link">
                                    <a href="../interfaces/NotificationInterface.html" >NotificationInterface</a>
                                </li>
                        </ul>
                    </li>
            
                    <li class="chapter">
                        <div class="simple menu-toggler" data-toggle="collapse"
                                data-target="#xs-pipes-links"
                            >
                            <span class="fa fa-plus"></span>
                            <span>Pipes</span>
                            <span class="fa fa-angle-down"></span>
                        </div>
                        <ul class="links collapse "
                                id="xs-pipes-links"
                            >
                                <li class="link">
                                    <a href="../pipes/DatePickerPipe.html" >DatePickerPipe</a>
                                </li>
                        </ul>
                    </li>
            
                    <li class="chapter">
                        <div class="simple menu-toggler" data-toggle="collapse"
                                data-target="#xs-miscellaneous-links"
                            >
                            <span class="fa fa-cubes"></span>
                            <span>Miscellaneous</span>
                            <span class="fa fa-angle-down"></span>
                        </div>
                        <ul class="links collapse "
                                id="xs-miscellaneous-links"
                            >
                                <li class="link">
                                  <a href="../miscellaneous/functions.html" data-type="entity-link" >Functions</a>
                                </li>
                                <li class="link">
                                  <a href="../miscellaneous/variables.html" data-type="entity-link" >Variables</a>
                                </li>
                        </ul>
                    </li>
            
                    <li class="chapter">
                        <a data-type="chapter-link" href="../routes.html" ><span class="fa fa-code-fork"></span>Routes</a>
                    </li>
            
                    <li class="chapter">
                        <a data-type="chapter-link" href="../coverage.html" ><span class="fa fa-tasks"></span>Documentation coverage</a>
                    </li>
            
                    <li class="divider"></li>
                    <li class="copyright">
                            Documentation generated using <a href="https://compodoc.github.io/website/" target="_blank">
                                        <img src="..//images/compodoc-vectorise.svg" class="img-responsive">
                            </a>
                    </li>
            
                </ul>
            
            </nav>
        </div>

        <div class="container-fluid main">
           <div class="row main">
               <div class="hidden-xs menu">
                   <nav>
                   
                       <ul class="list">
                   
                           <li class="title">
                               <a href="../index.html">angular-material-app documentation</a>
                           </li>
                   
                           <li class="divider"></li>
                   
                               <div id="book-search-input" role="search">
                                   <input type="text" placeholder="Type to search">
                               </div>
                   
                           <li class="chapter">
                               <a data-type="chapter-link" href="../index.html"><span class="fa fa-home"></span>Getting started</a>
                               <ul class="links">
                                       <li class="link">
                                           <a 
                                               
                                                href="../overview.html" 
                                                href="../overview.html" 
                                               >
                                               <span class="fa fa-th"></span>Overview
                                           </a>
                                       </li>
                                       <li class="link">
                                         <a href="../index.html" ><span class="fa fa-file-text-o"></span>README</a>
                                       </li>
                                       <li class="link">
                                               <a href="../changelog.html"
                                           >
                                               <span class="fa fa-file-text-o"></span>CHANGELOG
                                           </a>
                                       </li>
                                       <li class="link">
                                               <a href="../license.html"
                                           >
                                               <span class="fa fa-file-text-o"></span>LICENSE
                                           </a>
                                       </li>
                               </ul>
                           </li>
                   
                   
                           <li class="chapter">
                               <a data-type="chapter-link" href="../modules.html" >
                                   <div class="menu-toggler linked" data-toggle="collapse"
                                           data-target="#modules-links"
                                   >
                                       <span class="fa fa-archive"></span>
                                       <span class="link-name">Modules</span>
                                       <span class="fa fa-angle-down"></span>
                                   </div>
                               </a>
                               <ul class="links collapse "
                                       id="modules-links"
                   >
                                       <li class="link">
                                           <a href="../modules/AdminModule.html" >AdminModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/AmpaModule.html" >AmpaModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/AnalysisModule.html" >AnalysisModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/AnalysisRoutingModule.html" >AnalysisRoutingModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/ApmModule.html" >ApmModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/ApmRoutingModule.html" >ApmRoutingModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/AppModule.html" >AppModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/AppRoutingModule.html" >AppRoutingModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/BaseLayoutModule.html" >BaseLayoutModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/ButtonModule.html" >ButtonModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/ChartModule.html" >ChartModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/ChartRoutingModule.html" >ChartRoutingModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/ChatRoutingModule.html" >ChatRoutingModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/ChatsModule.html" >ChatsModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/ComponentModule.html" >ComponentModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/CoreModule.html" >CoreModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/CrmModule.html" >CrmModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/CrmRoutingModule.html" >CrmRoutingModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/DatePickerModule.html" >DatePickerModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/FileUploadModule.html" >FileUploadModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/FireBaseComponentsModule.html" >FireBaseComponentsModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/FormModule.html" >FormModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/FormsRoutingModule.html" >FormsRoutingModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/HeaderModule.html" >HeaderModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/HomeModule.html" >HomeModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/HomeRoutingModule.html" >HomeRoutingModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/LoadingModule.html" >LoadingModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/MailModule.html" >MailModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/MailRoutingModule.html" >MailRoutingModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/MaterialComponentsModule.html" >MaterialComponentsModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/MaterialsModule.html" >MaterialsModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/MaterialsRoutingModule.html" >MaterialsRoutingModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/NavigationModule.html" >NavigationModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/NavigationModule.html" >NavigationModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/NavigationRoutingModule.html" >NavigationRoutingModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/NotificaitonModule.html" >NotificaitonModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/NotificationContainerModule.html" >NotificationContainerModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/PageLayoutsModule.html" >PageLayoutsModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/PageLayoutsRoutingModule.html" >PageLayoutsRoutingModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/PagesModule.html" >PagesModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/PagesRoutingModule.html" >PagesRoutingModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/SearchModule.html" >SearchModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/SharedModule.html" >SharedModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/SidenavModule.html" >SidenavModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/TablesModule.html" >TablesModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/TablesRoutingModule.html" >TablesRoutingModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/TodoModule.html" >TodoModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/TodoRoutingModule.html" >TodoRoutingModule</a>
                                       </li>
                                       <li class="link">
                                           <a href="../modules/WidgetModule.html" >WidgetModule</a>
                                       </li>
                               </ul>
                           </li>
                   
                           <li class="chapter">
                               <div class="simple menu-toggler" data-toggle="collapse"
                                       data-target="#components-links"
                   >
                                   <span class="fa fa-cogs"></span>
                                   <span>Components</span>
                                   <span class="fa fa-angle-down"></span>
                               </div>
                               <ul class="links collapse "
                                       id="components-links"
                   >
                                       <li class="link">
                                           <a href="../components/AboutComponent.html" >AboutComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/AdminComponent.html" >AdminComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/AgeComponent.html" >AgeComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/AmapComponent.html" >AmapComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/AmapComponent.html" >AmapComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/AppComponent.html" >AppComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/BarComponent.html" >BarComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/BaseLayoutComponent.html" >BaseLayoutComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/BlogComponent.html" >BlogComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/BrandComponent.html" >BrandComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/BrandComponent.html" >BrandComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ButtonComponent.html" >ButtonComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ButtonsComponent.html" >ButtonsComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/CalendarComponent.html" >CalendarComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/CalendarComponent.html" >CalendarComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/CardsComponent.html" >CardsComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ChartComponent.html" >ChartComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ChatComponent.html" >ChatComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ChatsComponent.html" >ChatsComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ComposeComponent.html" >ComposeComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ConsumerComponent.html" >ConsumerComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ContactComponent.html" >ContactComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ContactComponent.html" >ContactComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ContactUpdateComponent.html" >ContactUpdateComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ContactsComponent.html" >ContactsComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ContractComponent.html" >ContractComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/CrmComponent.html" >CrmComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/CrowdComponent.html" >CrowdComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/CustomerCommonComponent.html" >CustomerCommonComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/CustomerComponent.html" >CustomerComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/CustomizerComponent.html" >CustomizerComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/DashboardComponent.html" >DashboardComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/DatatableComponent.html" >DatatableComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/DateDisplayComponent.html" >DateDisplayComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/DatePickerComponent.html" >DatePickerComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/DatePickerComponent.html" >DatePickerComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/DayButtonComponent.html" >DayButtonComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/DetailComponent.html" >DetailComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/DetailComponent.html" >DetailComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/DialogsComponent.html" >DialogsComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/DoughnutComponent.html" >DoughnutComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/DynamicComponent.html" >DynamicComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/EditorComponent.html" >EditorComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ElementsComponent.html" >ElementsComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/EquipmentBrandComponent.html" >EquipmentBrandComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/EquipmentComponent.html" >EquipmentComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ErrorComponent.html" >ErrorComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/FileManagerComponent.html" >FileManagerComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/FileUploadComponent.html" >FileUploadComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/FooterComponent.html" >FooterComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/FormsComponent.html" >FormsComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/FullwidthComponent.html" >FullwidthComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/GenderComponent.html" >GenderComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/HeaderComponent.html" >HeaderComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/HomeComponent.html" >HomeComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/IconComponent.html"  data-type="entity-link" class="active" >IconComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ItemComponent.html" >ItemComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/LeadComponent.html" >LeadComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/LineComponent.html" >LineComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ListComponent.html" >ListComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ListsComponent.html" >ListsComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/LoadingComponent.html" >LoadingComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/MailComponent.html" >MailComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/MarkdownComponent.html" >MarkdownComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/MenuComponent.html" >MenuComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/MonthComponent.html" >MonthComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/NavCollapseComponent.html" >NavCollapseComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/NavItemComponent.html" >NavItemComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/NavigationComponent.html" >NavigationComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/NavigationComponent.html" >NavigationComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/NoticeComponent.html" >NoticeComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/NotificationComponent.html" >NotificationComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/OperatorsComponent.html" >OperatorsComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/OpportunitiesComponent.html" >OpportunitiesComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/PagesComponent.html" >PagesComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/PaginationComponent.html" >PaginationComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/PaginationComponent.html" >PaginationComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/PerformanceComponent.html" >PerformanceComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/PermeabilityComponent.html" >PermeabilityComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/PieComponent.html" >PieComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/PolarComponent.html" >PolarComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/PopoverComponent.html" >PopoverComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/PopoverComponent.html" >PopoverComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/PopulationComponent.html" >PopulationComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/PreferenceComponent.html" >PreferenceComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/PreferenceFieldComponent.html" >PreferenceFieldComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ProductComponent.html" >ProductComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ProfileComponent.html" >ProfileComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ProjectComponent.html" >ProjectComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/RadarComponent.html" >RadarComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/RegionComponent.html" >RegionComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ScenePortraitComponent.html" >ScenePortraitComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/SearchComponent.html" >SearchComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ServicesComponent.html" >ServicesComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/SidenavComponent.html" >SidenavComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/SigninComponent.html" >SigninComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/SignupComponent.html" >SignupComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/SliderComponent.html" >SliderComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/StateComponent.html" >StateComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/StaticComponent.html" >StaticComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/SwitchComponent.html" >SwitchComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/TableComponent.html" >TableComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/TablesComponent.html" >TablesComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/TabsComponent.html" >TabsComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ToastComponent.html" >ToastComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/TodoComponent.html" >TodoComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/TodoHeaderComponent.html" >TodoHeaderComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/TodoItemComponent.html" >TodoItemComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/TodoListComponent.html" >TodoListComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/TodoSearchComponent.html" >TodoSearchComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/TodoSidenavComponent.html" >TodoSidenavComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/TodoToolbarComponent.html" >TodoToolbarComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ToolbarComponent.html" >ToolbarComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ToolbarComponent.html" >ToolbarComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ToolbarHelpComponent.html" >ToolbarHelpComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ToolbarNotificationComponent.html" >ToolbarNotificationComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ToolbarUserComponent.html" >ToolbarUserComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/TooltipsComponent.html" >TooltipsComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/UserComponent.html" >UserComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ValidationComponent.html" >ValidationComponent</a>
                                       </li>
                                       <li class="link">
                                           <a href="../components/ViewComponent.html" >ViewComponent</a>
                                       </li>
                               </ul>
                           </li>
                   
                           <li class="chapter">
                               <div class="simple menu-toggler" data-toggle="collapse"
                                       data-target="#directives-links"
                   >
                                   <span class="fa fa-code"></span>
                                   <span>Directives</span>
                                   <span class="fa fa-angle-down"></span>
                               </div>
                               <ul class="links collapse "
                                       id="directives-links"
                   >
                                       <li class="link">
                                           <a href="../directives/ButtonDirective.html" >ButtonDirective</a>
                                       </li>
                                       <li class="link">
                                           <a href="../directives/FileUploadDirective.html" >FileUploadDirective</a>
                                       </li>
                                       <li class="link">
                                           <a href="../directives/LoadingDirective.html" >LoadingDirective</a>
                                       </li>
                                       <li class="link">
                                           <a href="../directives/NotificationContainerDirective.html" >NotificationContainerDirective</a>
                                       </li>
                                       <li class="link">
                                           <a href="../directives/PopoverDirective.html" >PopoverDirective</a>
                                       </li>
                               </ul>
                           </li>
                   
                           <li class="chapter">
                               <div class="simple menu-toggler" data-toggle="collapse"
                                       data-target="#classes-links"
                   >
                                   <span class="fa fa-file-code-o"></span>
                                   <span>Classes</span>
                                   <span class="fa fa-angle-down"></span>
                               </div>
                               <ul class="links collapse "
                                       id="classes-links"
                   >
                                       <li class="link">
                                           <a href="../classes/Chat.html" >Chat</a>
                                       </li>
                                       <li class="link">
                                           <a href="../classes/NavigationModel.html" >NavigationModel</a>
                                       </li>
                                       <li class="link">
                                           <a href="../classes/NotificationConfig.html" >NotificationConfig</a>
                                       </li>
                                       <li class="link">
                                           <a href="../classes/NotificationInjector.html" >NotificationInjector</a>
                                       </li>
                                       <li class="link">
                                           <a href="../classes/NotificationRef.html" >NotificationRef</a>
                                       </li>
                                       <li class="link">
                                           <a href="../classes/SidenavItem.html" >SidenavItem</a>
                                       </li>
                                       <li class="link">
                                           <a href="../classes/Todo.html" >Todo</a>
                                       </li>
                                       <li class="link">
                                           <a href="../classes/ToolbarNotificationModel.html" >ToolbarNotificationModel</a>
                                       </li>
                                       <li class="link">
                                           <a href="../classes/Upload.html" >Upload</a>
                                       </li>
                               </ul>
                           </li>
                   
                           <li class="chapter">
                               <div class="simple menu-toggler" data-toggle="collapse"
                                       data-target="#injectables-links"
                   >
                                   <span class="fa fa-long-arrow-down"></span>
                                   <span>Injectables</span>
                                   <span class="fa fa-angle-down"></span>
                               </div>
                               <ul class="links collapse "
                                       id="injectables-links"
                   >
                                       <li class="link">
                                           <a href="../injectables/AnalysisService.html" >AnalysisService</a>
                                       </li>
                                       <li class="link">
                                           <a href="../injectables/ApmService.html" >ApmService</a>
                                       </li>
                                       <li class="link">
                                           <a href="../injectables/AuthService.html" >AuthService</a>
                                       </li>
                                       <li class="link">
                                           <a href="../injectables/ChatsService.html" >ChatsService</a>
                                       </li>
                                       <li class="link">
                                           <a href="../injectables/ConfigService.html" >ConfigService</a>
                                       </li>
                                       <li class="link">
                                           <a href="../injectables/DataTableService.html" >DataTableService</a>
                                       </li>
                                       <li class="link">
                                           <a href="../injectables/FileManagerFirebase.html" >FileManagerFirebase</a>
                                       </li>
                                       <li class="link">
                                           <a href="../injectables/FileUploadService.html" >FileUploadService</a>
                                       </li>
                                       <li class="link">
                                           <a href="../injectables/LeadService.html" >LeadService</a>
                                       </li>
                                       <li class="link">
                                           <a href="../injectables/MailService.html" >MailService</a>
                                       </li>
                                       <li class="link">
                                           <a href="../injectables/NavigationService.html" >NavigationService</a>
                                       </li>
                                       <li class="link">
                                           <a href="../injectables/NavigationService.html" >NavigationService</a>
                                       </li>
                                       <li class="link">
                                           <a href="../injectables/NotificationService.html" >NotificationService</a>
                                       </li>
                                       <li class="link">
                                           <a href="../injectables/SidenavService.html" >SidenavService</a>
                                       </li>
                                       <li class="link">
                                           <a href="../injectables/TodoService.html" >TodoService</a>
                                       </li>
                                       <li class="link">
                                           <a href="../injectables/ToolbarNotificationService.html" >ToolbarNotificationService</a>
                                       </li>
                                       <li class="link">
                                           <a href="../injectables/UserService.html" >UserService</a>
                                       </li>
                               </ul>
                           </li>
                   
                   
                           <li class="chapter">
                               <div class="simple menu-toggler" data-toggle="collapse"
                                       data-target="#interfaces-links"
                   >
                                   <span class="fa fa-info"></span>
                                   <span>Interfaces</span>
                                   <span class="fa fa-angle-down"></span>
                               </div>
                               <ul class="links collapse "
                                       id="interfaces-links"
                   >
                                       <li class="link">
                                           <a href="../interfaces/Activate.html" >Activate</a>
                                       </li>
                                       <li class="link">
                                           <a href="../interfaces/IMapAPILoaderConfig.html" >IMapAPILoaderConfig</a>
                                       </li>
                                       <li class="link">
                                           <a href="../interfaces/LoadingInterface.html" >LoadingInterface</a>
                                       </li>
                                       <li class="link">
                                           <a href="../interfaces/NotificationIconClasses.html" >NotificationIconClasses</a>
                                       </li>
                                       <li class="link">
                                           <a href="../interfaces/NotificationInterface.html" >NotificationInterface</a>
                                       </li>
                               </ul>
                           </li>
                   
                           <li class="chapter">
                               <div class="simple menu-toggler" data-toggle="collapse"
                                       data-target="#pipes-links"
                   >
                                   <span class="fa fa-plus"></span>
                                   <span>Pipes</span>
                                   <span class="fa fa-angle-down"></span>
                               </div>
                               <ul class="links collapse "
                                       id="pipes-links"
                   >
                                       <li class="link">
                                           <a href="../pipes/DatePickerPipe.html" >DatePickerPipe</a>
                                       </li>
                               </ul>
                           </li>
                   
                           <li class="chapter">
                               <div class="simple menu-toggler" data-toggle="collapse"
                                       data-target="#miscellaneous-links"
                   >
                                   <span class="fa fa-cubes"></span>
                                   <span>Miscellaneous</span>
                                   <span class="fa fa-angle-down"></span>
                               </div>
                               <ul class="links collapse "
                                       id="miscellaneous-links"
                   >
                                       <li class="link">
                                         <a href="../miscellaneous/functions.html" data-type="entity-link" >Functions</a>
                                       </li>
                                       <li class="link">
                                         <a href="../miscellaneous/variables.html" data-type="entity-link" >Variables</a>
                                       </li>
                               </ul>
                           </li>
                   
                           <li class="chapter">
                               <a data-type="chapter-link" href="../routes.html" ><span class="fa fa-code-fork"></span>Routes</a>
                           </li>
                   
                           <li class="chapter">
                               <a data-type="chapter-link" href="../coverage.html" ><span class="fa fa-tasks"></span>Documentation coverage</a>
                           </li>
                   
                           <li class="divider"></li>
                           <li class="copyright">
                                   Documentation generated using <a href="https://compodoc.github.io/website/" target="_blank">
                                               <img src="..//images/compodoc-vectorise.svg" class="img-responsive">
                                   </a>
                           </li>
                   
                       </ul>
                   
                   </nav>
               </div>
               <div class="content component">
                   <div class="content-data">




<ol class="breadcrumb">
  <li>Components</li>
  <li>IconComponent</li>
</ol>

<ul class="nav nav-tabs" role="tablist">
    <li class="active">
        <a href="#info" id="info-tab" role="tab" data-toggle="tab" data-link="info">Info</a>
    </li>

    <li>
        <a href="#source" role="tab" id="source-tab" data-toggle="tab" data-link="source">Source</a>
    </li>

    <li>
        <a href="#templateData" role="tab" id="templateData-tab" data-toggle="tab" data-link="template">Template</a>
    </li>
    <li>
        <a href="#tree" role="tab" id="tree-tab" data-toggle="tab" data-link="dom-tree">DOM Tree</a>
    </li>
</ul>

<div class="tab-content">
    <div class="tab-pane fade active in" id="c-info"><p class="comment">
    <h3>File</h3>
</p>
<p class="comment">
    <code>src/app/materials/icon/icon.component.ts</code>
</p>



    <p class="comment">
        <h3>Implements</h3>
    </p>
    <p class="comment">
                <code><a href="https://angular.io/api/core/OnInit" target="_blank" >OnInit</a></code>
    </p>


<section>
    <h3>Metadata</h3>
    <table class="table table-sm table-hover">
        <tbody>












            <tr>
                <td class="col-md-3">selector</td>
                <td class="col-md-9"><code>app-icon</code></td>
            </tr>

            <tr>
                <td class="col-md-3">styleUrls</td>
                <td class="col-md-9"><code>icon.component.scss</code></td>
            </tr>



            <tr>
                <td class="col-md-3">templateUrl</td>
                <td class="col-md-9"><code>./icon.component.html</code></td>
            </tr>


        </tbody>
    </table>
</section>

    <section>
        <h3 id="index">Index</h3>
        <table class="table table-sm table-bordered index-table">
            <tbody>
                <tr>
                    <td class="col-md-4">
                        <h6><b>Methods</b></h6>
                    </td>
                </tr>
                <tr>
                    <td class="col-md-4">
                        <ul class="index-list">
                            <li>
                                <a href="#ngOnInit">ngOnInit</a>
                            </li>
                        </ul>
                    </td>
                </tr>
            </tbody>
        </table>
    </section>

    <section>
        <h3 id="constructor">Constructor</h3>
            <table class="table table-sm table-bordered">
                <tbody>
                    <tr>
                        <td class="col-md-4">
                            <code>constructor()</code>
                        </td>
                    </tr>
                            <tr>
                                <td class="col-md-4">
                                    <div class="io-line">Defined in <a href="" data-line="8" class="link-to-prism">src/app/materials/icon/icon.component.ts:8</a></div>
                                </td>
                            </tr>
    
                </tbody>
            </table>
    </section>





    <section>
        
            <h3 id="methods">
                Methods
            </h3>
            <table class="table table-sm table-bordered">
                <tbody>
                    <tr>
                        <td class="col-md-4">
                            <a name="ngOnInit"></a>
                            <span class="name">
                                <b>
                                ngOnInit
                                </b>
                                <a href="#ngOnInit"><span class="fa fa-link"></span></a>
                            </span>
                        </td>
                    </tr>
                    <tr>
                        <td class="col-md-4">
    <code>ngOnInit()</code>
                        </td>
                    </tr>
    
    
                            <tr>
                                <td class="col-md-4">
                                    <div class="io-line">Defined in <a href="" data-line="12" class="link-to-prism">src/app/materials/icon/icon.component.ts:12</a></div>
                                </td>
                            </tr>
    
                    <tr>
                        <td class="col-md-4">
    
                                <div class="io-description">
                                    <b>Returns : </b>    <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>
    
                                </div>
                        </td>
                    </tr>
                </tbody>
            </table>
    </section>


</div>


    <div class="tab-pane fade tab-source-code" id="c-source">
        <pre class="line-numbers"><code class="language-typescript">import { Component, OnInit } from &#x27;@angular/core&#x27;;

@Component({
  selector: &#x27;app-icon&#x27;,
  templateUrl: &#x27;./icon.component.html&#x27;,
  styleUrls: [&#x27;./icon.component.scss&#x27;]
})
export class IconComponent implements OnInit {

  constructor() { }

  ngOnInit() {
  }

}
</code></pre>
    </div>

    <div class="tab-pane fade" id="c-templateData">
        <pre class="line-numbers"><code class="language-html">&lt;mat-card&gt;
  &lt;mat-card-title&gt;图标&lt;/mat-card-title&gt;
  &lt;mat-card-content&gt;
    &lt;mat-icon&gt;account_balance&lt;/mat-icon&gt;
    &lt;mat-icon&gt;account_balance_wallet&lt;/mat-icon&gt;
    &lt;mat-icon&gt;account_box&lt;/mat-icon&gt;
    &lt;mat-icon&gt;account_circle&lt;/mat-icon&gt;
    &lt;mat-icon&gt;adb&lt;/mat-icon&gt;
    &lt;mat-icon&gt;add&lt;/mat-icon&gt;
    &lt;mat-icon&gt;add_alarm&lt;/mat-icon&gt;
    &lt;mat-icon&gt;add_alert&lt;/mat-icon&gt;
    &lt;mat-icon&gt;add_box&lt;/mat-icon&gt;
    &lt;mat-icon&gt;add_circle&lt;/mat-icon&gt;
    &lt;mat-icon&gt;add_circle_outline&lt;/mat-icon&gt;
    &lt;mat-icon&gt;add_shopping_cart&lt;/mat-icon&gt;
    &lt;mat-icon&gt;add_to_photos&lt;/mat-icon&gt;
    &lt;mat-icon&gt;adjust&lt;/mat-icon&gt;
    &lt;mat-icon&gt;airline_seat_flat&lt;/mat-icon&gt;
    &lt;mat-icon&gt;airline_seat_flat_angled&lt;/mat-icon&gt;
    &lt;mat-icon&gt;airline_seat_individual_suite&lt;/mat-icon&gt;
    &lt;mat-icon&gt;airline_seat_legroom_extra&lt;/mat-icon&gt;
    &lt;mat-icon&gt;airline_seat_legroom_normal&lt;/mat-icon&gt;
    &lt;mat-icon&gt;airline_seat_legroom_reduced&lt;/mat-icon&gt;
    &lt;mat-icon&gt;airline_seat_recline_extra&lt;/mat-icon&gt;
    &lt;mat-icon&gt;airline_seat_recline_normal&lt;/mat-icon&gt;
    &lt;mat-icon&gt;airplanemode_active&lt;/mat-icon&gt;
    &lt;mat-icon&gt;airplanemode_inactive&lt;/mat-icon&gt;
    &lt;mat-icon&gt;airplay&lt;/mat-icon&gt;
    &lt;mat-icon&gt;alarm&lt;/mat-icon&gt;
    &lt;mat-icon&gt;alarm_add&lt;/mat-icon&gt;
    &lt;mat-icon&gt;alarm_off&lt;/mat-icon&gt;
    &lt;mat-icon&gt;alarm_on&lt;/mat-icon&gt;
    &lt;mat-icon&gt;album&lt;/mat-icon&gt;
    &lt;mat-icon&gt;android&lt;/mat-icon&gt;
    &lt;mat-icon&gt;announcement&lt;/mat-icon&gt;
    &lt;mat-icon&gt;apps&lt;/mat-icon&gt;
    &lt;mat-icon&gt;archive&lt;/mat-icon&gt;
    &lt;mat-icon&gt;arrow_back&lt;/mat-icon&gt;
    &lt;mat-icon&gt;arrow_drop_down&lt;/mat-icon&gt;
    &lt;mat-icon&gt;arrow_drop_down_circle&lt;/mat-icon&gt;
    &lt;mat-icon&gt;arrow_drop_up&lt;/mat-icon&gt;
    &lt;mat-icon&gt;arrow_forward&lt;/mat-icon&gt;
    &lt;mat-icon&gt;aspect_ratio&lt;/mat-icon&gt;
    &lt;mat-icon&gt;assessment&lt;/mat-icon&gt;
    &lt;mat-icon&gt;assignment&lt;/mat-icon&gt;
    &lt;mat-icon&gt;assignment_ind&lt;/mat-icon&gt;
    &lt;mat-icon&gt;assignment_late&lt;/mat-icon&gt;
    &lt;mat-icon&gt;assignment_return&lt;/mat-icon&gt;
    &lt;mat-icon&gt;assignment_returned&lt;/mat-icon&gt;
    &lt;mat-icon&gt;assignment_turned_in&lt;/mat-icon&gt;
    &lt;mat-icon&gt;assistant&lt;/mat-icon&gt;
    &lt;mat-icon&gt;assistant_photo&lt;/mat-icon&gt;
    &lt;mat-icon&gt;attach_file&lt;/mat-icon&gt;
    &lt;mat-icon&gt;attach_money&lt;/mat-icon&gt;
    &lt;mat-icon&gt;attachment&lt;/mat-icon&gt;
    &lt;mat-icon&gt;audiotrack&lt;/mat-icon&gt;
    &lt;mat-icon&gt;autorenew&lt;/mat-icon&gt;
    &lt;mat-icon&gt;av_timer&lt;/mat-icon&gt;
    &lt;mat-icon&gt;backspace&lt;/mat-icon&gt;
    &lt;mat-icon&gt;backup&lt;/mat-icon&gt;
    &lt;mat-icon&gt;battery_alert&lt;/mat-icon&gt;
    &lt;mat-icon&gt;battery_charging_full&lt;/mat-icon&gt;
    &lt;mat-icon&gt;battery_full&lt;/mat-icon&gt;
    &lt;mat-icon&gt;battery_std&lt;/mat-icon&gt;
    &lt;mat-icon&gt;battery_unknown&lt;/mat-icon&gt;
    &lt;mat-icon&gt;beenhere&lt;/mat-icon&gt;
    &lt;mat-icon&gt;block&lt;/mat-icon&gt;
    &lt;mat-icon&gt;bluetooth&lt;/mat-icon&gt;
    &lt;mat-icon&gt;bluetooth_audio&lt;/mat-icon&gt;
    &lt;mat-icon&gt;bluetooth_connected&lt;/mat-icon&gt;
    &lt;mat-icon&gt;bluetooth_disabled&lt;/mat-icon&gt;
    &lt;mat-icon&gt;bluetooth_searching&lt;/mat-icon&gt;
    &lt;mat-icon&gt;blur_circular&lt;/mat-icon&gt;
    &lt;mat-icon&gt;blur_linear&lt;/mat-icon&gt;
    &lt;mat-icon&gt;blur_off&lt;/mat-icon&gt;
    &lt;mat-icon&gt;blur_on&lt;/mat-icon&gt;
    &lt;mat-icon&gt;book&lt;/mat-icon&gt;
    &lt;mat-icon&gt;bookmark&lt;/mat-icon&gt;
    &lt;mat-icon&gt;bookmark_border&lt;/mat-icon&gt;
    &lt;mat-icon&gt;border_all&lt;/mat-icon&gt;
    &lt;mat-icon&gt;border_bottom&lt;/mat-icon&gt;
    &lt;mat-icon&gt;border_clear&lt;/mat-icon&gt;
    &lt;mat-icon&gt;border_color&lt;/mat-icon&gt;
    &lt;mat-icon&gt;border_horizontal&lt;/mat-icon&gt;
    &lt;mat-icon&gt;border_inner&lt;/mat-icon&gt;
    &lt;mat-icon&gt;border_left&lt;/mat-icon&gt;
    &lt;mat-icon&gt;border_outer&lt;/mat-icon&gt;
    &lt;mat-icon&gt;border_right&lt;/mat-icon&gt;
    &lt;mat-icon&gt;border_style&lt;/mat-icon&gt;
    &lt;mat-icon&gt;border_top&lt;/mat-icon&gt;
    &lt;mat-icon&gt;border_vertical&lt;/mat-icon&gt;
    &lt;mat-icon&gt;brightness_1&lt;/mat-icon&gt;
    &lt;mat-icon&gt;brightness_2&lt;/mat-icon&gt;
    &lt;mat-icon&gt;brightness_3&lt;/mat-icon&gt;
    &lt;mat-icon&gt;brightness_4&lt;/mat-icon&gt;
    &lt;mat-icon&gt;brightness_5&lt;/mat-icon&gt;
    &lt;mat-icon&gt;brightness_6&lt;/mat-icon&gt;
    &lt;mat-icon&gt;brightness_7&lt;/mat-icon&gt;
    &lt;mat-icon&gt;brightness_auto&lt;/mat-icon&gt;
    &lt;mat-icon&gt;brightness_high&lt;/mat-icon&gt;
    &lt;mat-icon&gt;brightness_low&lt;/mat-icon&gt;
    &lt;mat-icon&gt;brightness_medium&lt;/mat-icon&gt;
    &lt;mat-icon&gt;broken_image&lt;/mat-icon&gt;
    &lt;mat-icon&gt;brush&lt;/mat-icon&gt;
    &lt;mat-icon&gt;bug_report&lt;/mat-icon&gt;
    &lt;mat-icon&gt;build&lt;/mat-icon&gt;
    &lt;mat-icon&gt;business&lt;/mat-icon&gt;
    &lt;mat-icon&gt;cached&lt;/mat-icon&gt;
    &lt;mat-icon&gt;cake&lt;/mat-icon&gt;
    &lt;mat-icon&gt;call&lt;/mat-icon&gt;
    &lt;mat-icon&gt;call_end&lt;/mat-icon&gt;
    &lt;mat-icon&gt;call_made&lt;/mat-icon&gt;
    &lt;mat-icon&gt;call_merge&lt;/mat-icon&gt;
    &lt;mat-icon&gt;call_missed&lt;/mat-icon&gt;
    &lt;mat-icon&gt;call_received&lt;/mat-icon&gt;
    &lt;mat-icon&gt;call_split&lt;/mat-icon&gt;
    &lt;mat-icon&gt;camera&lt;/mat-icon&gt;
    &lt;mat-icon&gt;camera_alt&lt;/mat-icon&gt;
    &lt;mat-icon&gt;camera_enhance&lt;/mat-icon&gt;
    &lt;mat-icon&gt;camera_front&lt;/mat-icon&gt;
    &lt;mat-icon&gt;camera_rear&lt;/mat-icon&gt;
    &lt;mat-icon&gt;camera_roll&lt;/mat-icon&gt;
    &lt;mat-icon&gt;cancel&lt;/mat-icon&gt;
    &lt;mat-icon&gt;card_giftcard&lt;/mat-icon&gt;
    &lt;mat-icon&gt;card_membership&lt;/mat-icon&gt;
    &lt;mat-icon&gt;card_travel&lt;/mat-icon&gt;
    &lt;mat-icon&gt;cast&lt;/mat-icon&gt;
    &lt;mat-icon&gt;cast_connected&lt;/mat-icon&gt;
    &lt;mat-icon&gt;center_focus_strong&lt;/mat-icon&gt;
    &lt;mat-icon&gt;center_focus_weak&lt;/mat-icon&gt;
    &lt;mat-icon&gt;change_history&lt;/mat-icon&gt;
    &lt;mat-icon&gt;chat&lt;/mat-icon&gt;
    &lt;mat-icon&gt;chat_bubble&lt;/mat-icon&gt;
    &lt;mat-icon&gt;chat_bubble_outline&lt;/mat-icon&gt;
    &lt;mat-icon&gt;check&lt;/mat-icon&gt;
    &lt;mat-icon&gt;check_box&lt;/mat-icon&gt;
    &lt;mat-icon&gt;check_box_outline_blank&lt;/mat-icon&gt;
    &lt;mat-icon&gt;check_circle&lt;/mat-icon&gt;
    &lt;mat-icon&gt;chevron_left&lt;/mat-icon&gt;
    &lt;mat-icon&gt;chevron_right&lt;/mat-icon&gt;
    &lt;mat-icon&gt;chrome_reader_mode&lt;/mat-icon&gt;
    &lt;mat-icon&gt;class&lt;/mat-icon&gt;
    &lt;mat-icon&gt;clear&lt;/mat-icon&gt;
    &lt;mat-icon&gt;clear_all&lt;/mat-icon&gt;
    &lt;mat-icon&gt;close&lt;/mat-icon&gt;
    &lt;mat-icon&gt;closed_caption&lt;/mat-icon&gt;
    &lt;mat-icon&gt;cloud&lt;/mat-icon&gt;
    &lt;mat-icon&gt;cloud_circle&lt;/mat-icon&gt;
    &lt;mat-icon&gt;cloud_done&lt;/mat-icon&gt;
    &lt;mat-icon&gt;cloud_download&lt;/mat-icon&gt;
    &lt;mat-icon&gt;cloud_off&lt;/mat-icon&gt;
    &lt;mat-icon&gt;cloud_queue&lt;/mat-icon&gt;
    &lt;mat-icon&gt;cloud_upload&lt;/mat-icon&gt;
    &lt;mat-icon&gt;code&lt;/mat-icon&gt;
    &lt;mat-icon&gt;collections&lt;/mat-icon&gt;
    &lt;mat-icon&gt;collections_bookmark&lt;/mat-icon&gt;
    &lt;mat-icon&gt;color_lens&lt;/mat-icon&gt;
    &lt;mat-icon&gt;colorize&lt;/mat-icon&gt;
    &lt;mat-icon&gt;comment&lt;/mat-icon&gt;
    &lt;mat-icon&gt;compare&lt;/mat-icon&gt;
    &lt;mat-icon&gt;computer&lt;/mat-icon&gt;
    &lt;mat-icon&gt;confirmation_number&lt;/mat-icon&gt;
    &lt;mat-icon&gt;contact_phone&lt;/mat-icon&gt;
    &lt;mat-icon&gt;contacts&lt;/mat-icon&gt;
    &lt;mat-icon&gt;content_copy&lt;/mat-icon&gt;
    &lt;mat-icon&gt;content_cut&lt;/mat-icon&gt;
    &lt;mat-icon&gt;content_paste&lt;/mat-icon&gt;
    &lt;mat-icon&gt;control_point&lt;/mat-icon&gt;
    &lt;mat-icon&gt;control_point_duplicate&lt;/mat-icon&gt;
    &lt;mat-icon&gt;create&lt;/mat-icon&gt;
    &lt;mat-icon&gt;credit_card&lt;/mat-icon&gt;
    &lt;mat-icon&gt;crop&lt;/mat-icon&gt;
    &lt;mat-icon&gt;crop_16_9&lt;/mat-icon&gt;
    &lt;mat-icon&gt;crop_3_2&lt;/mat-icon&gt;
    &lt;mat-icon&gt;crop_5_4&lt;/mat-icon&gt;
    &lt;mat-icon&gt;crop_7_5&lt;/mat-icon&gt;
    &lt;mat-icon&gt;crop_din&lt;/mat-icon&gt;
    &lt;mat-icon&gt;crop_free&lt;/mat-icon&gt;
    &lt;mat-icon&gt;crop_landscape&lt;/mat-icon&gt;
    &lt;mat-icon&gt;crop_original&lt;/mat-icon&gt;
    &lt;mat-icon&gt;crop_portrait&lt;/mat-icon&gt;
    &lt;mat-icon&gt;crop_square&lt;/mat-icon&gt;
    &lt;mat-icon&gt;dashboard&lt;/mat-icon&gt;
    &lt;mat-icon&gt;data_usage&lt;/mat-icon&gt;
    &lt;mat-icon&gt;dehaze&lt;/mat-icon&gt;
    &lt;mat-icon&gt;delete&lt;/mat-icon&gt;
    &lt;mat-icon&gt;description&lt;/mat-icon&gt;
    &lt;mat-icon&gt;desktop_mac&lt;/mat-icon&gt;
    &lt;mat-icon&gt;desktop_windows&lt;/mat-icon&gt;
    &lt;mat-icon&gt;details&lt;/mat-icon&gt;
    &lt;mat-icon&gt;developer_board&lt;/mat-icon&gt;
    &lt;mat-icon&gt;developer_mode&lt;/mat-icon&gt;
    &lt;mat-icon&gt;device_hub&lt;/mat-icon&gt;
    &lt;mat-icon&gt;devices&lt;/mat-icon&gt;
    &lt;mat-icon&gt;dialer_sip&lt;/mat-icon&gt;
    &lt;mat-icon&gt;dialpad&lt;/mat-icon&gt;
    &lt;mat-icon&gt;directions&lt;/mat-icon&gt;
    &lt;mat-icon&gt;directions_bike&lt;/mat-icon&gt;
    &lt;mat-icon&gt;directions_boat&lt;/mat-icon&gt;
    &lt;mat-icon&gt;directions_bus&lt;/mat-icon&gt;
    &lt;mat-icon&gt;directions_car&lt;/mat-icon&gt;
    &lt;mat-icon&gt;directions_railway&lt;/mat-icon&gt;
    &lt;mat-icon&gt;directions_run&lt;/mat-icon&gt;
    &lt;mat-icon&gt;directions_subway&lt;/mat-icon&gt;
    &lt;mat-icon&gt;directions_transit&lt;/mat-icon&gt;
    &lt;mat-icon&gt;directions_walk&lt;/mat-icon&gt;
    &lt;mat-icon&gt;disc_full&lt;/mat-icon&gt;
    &lt;mat-icon&gt;dns&lt;/mat-icon&gt;
    &lt;mat-icon&gt;do_not_disturb&lt;/mat-icon&gt;
    &lt;mat-icon&gt;do_not_disturb_alt&lt;/mat-icon&gt;
    &lt;mat-icon&gt;dock&lt;/mat-icon&gt;
    &lt;mat-icon&gt;domain&lt;/mat-icon&gt;
    &lt;mat-icon&gt;done&lt;/mat-icon&gt;
    &lt;mat-icon&gt;done_all&lt;/mat-icon&gt;
    &lt;mat-icon&gt;drafts&lt;/mat-icon&gt;
    &lt;mat-icon&gt;drive_eta&lt;/mat-icon&gt;
    &lt;mat-icon&gt;dvr&lt;/mat-icon&gt;
    &lt;mat-icon&gt;edit&lt;/mat-icon&gt;
    &lt;mat-icon&gt;eject&lt;/mat-icon&gt;
    &lt;mat-icon&gt;email&lt;/mat-icon&gt;
    &lt;mat-icon&gt;equalizer&lt;/mat-icon&gt;
    &lt;mat-icon&gt;error&lt;/mat-icon&gt;
    &lt;mat-icon&gt;error_outline&lt;/mat-icon&gt;
    &lt;mat-icon&gt;event&lt;/mat-icon&gt;
    &lt;mat-icon&gt;event_available&lt;/mat-icon&gt;
    &lt;mat-icon&gt;event_busy&lt;/mat-icon&gt;
    &lt;mat-icon&gt;event_note&lt;/mat-icon&gt;
    &lt;mat-icon&gt;event_seat&lt;/mat-icon&gt;
    &lt;mat-icon&gt;exit_to_app&lt;/mat-icon&gt;
    &lt;mat-icon&gt;expand_less&lt;/mat-icon&gt;
    &lt;mat-icon&gt;expand_more&lt;/mat-icon&gt;
    &lt;mat-icon&gt;explicit&lt;/mat-icon&gt;
    &lt;mat-icon&gt;explore&lt;/mat-icon&gt;
    &lt;mat-icon&gt;exposure&lt;/mat-icon&gt;
    &lt;mat-icon&gt;exposure_neg_1&lt;/mat-icon&gt;
    &lt;mat-icon&gt;exposure_neg_2&lt;/mat-icon&gt;
    &lt;mat-icon&gt;exposure_plus_1&lt;/mat-icon&gt;
    &lt;mat-icon&gt;exposure_plus_2&lt;/mat-icon&gt;
    &lt;mat-icon&gt;exposure_zero&lt;/mat-icon&gt;
    &lt;mat-icon&gt;extension&lt;/mat-icon&gt;
    &lt;mat-icon&gt;face&lt;/mat-icon&gt;
    &lt;mat-icon&gt;fast_forward&lt;/mat-icon&gt;
    &lt;mat-icon&gt;fast_rewind&lt;/mat-icon&gt;
    &lt;mat-icon&gt;favorite&lt;/mat-icon&gt;
    &lt;mat-icon&gt;favorite_border&lt;/mat-icon&gt;
    &lt;mat-icon&gt;feedback&lt;/mat-icon&gt;
    &lt;mat-icon&gt;file_download&lt;/mat-icon&gt;
    &lt;mat-icon&gt;file_upload&lt;/mat-icon&gt;
    &lt;mat-icon&gt;filter&lt;/mat-icon&gt;
    &lt;mat-icon&gt;filter_1&lt;/mat-icon&gt;
    &lt;mat-icon&gt;filter_2&lt;/mat-icon&gt;
    &lt;mat-icon&gt;filter_3&lt;/mat-icon&gt;
    &lt;mat-icon&gt;filter_4&lt;/mat-icon&gt;
    &lt;mat-icon&gt;filter_5&lt;/mat-icon&gt;
    &lt;mat-icon&gt;filter_6&lt;/mat-icon&gt;
    &lt;mat-icon&gt;filter_7&lt;/mat-icon&gt;
    &lt;mat-icon&gt;filter_8&lt;/mat-icon&gt;
    &lt;mat-icon&gt;filter_9&lt;/mat-icon&gt;
    &lt;mat-icon&gt;filter_9_plus&lt;/mat-icon&gt;
    &lt;mat-icon&gt;filter_b_and_w&lt;/mat-icon&gt;
    &lt;mat-icon&gt;filter_center_focus&lt;/mat-icon&gt;
    &lt;mat-icon&gt;filter_drama&lt;/mat-icon&gt;
    &lt;mat-icon&gt;filter_frames&lt;/mat-icon&gt;
    &lt;mat-icon&gt;filter_hdr&lt;/mat-icon&gt;
    &lt;mat-icon&gt;filter_list&lt;/mat-icon&gt;
    &lt;mat-icon&gt;filter_none&lt;/mat-icon&gt;
    &lt;mat-icon&gt;filter_tilt_shift&lt;/mat-icon&gt;
    &lt;mat-icon&gt;filter_vintage&lt;/mat-icon&gt;
    &lt;mat-icon&gt;find_in_page&lt;/mat-icon&gt;
    &lt;mat-icon&gt;find_replace&lt;/mat-icon&gt;
    &lt;mat-icon&gt;flag&lt;/mat-icon&gt;
    &lt;mat-icon&gt;flare&lt;/mat-icon&gt;
    &lt;mat-icon&gt;flash_auto&lt;/mat-icon&gt;
    &lt;mat-icon&gt;flash_off&lt;/mat-icon&gt;
    &lt;mat-icon&gt;flash_on&lt;/mat-icon&gt;
    &lt;mat-icon&gt;flight&lt;/mat-icon&gt;
    &lt;mat-icon&gt;flight_land&lt;/mat-icon&gt;
    &lt;mat-icon&gt;flight_takeoff&lt;/mat-icon&gt;
    &lt;mat-icon&gt;flip&lt;/mat-icon&gt;
    &lt;mat-icon&gt;flip_to_back&lt;/mat-icon&gt;
    &lt;mat-icon&gt;flip_to_front&lt;/mat-icon&gt;
    &lt;mat-icon&gt;folder&lt;/mat-icon&gt;
    &lt;mat-icon&gt;folder_open&lt;/mat-icon&gt;
    &lt;mat-icon&gt;folder_shared&lt;/mat-icon&gt;
    &lt;mat-icon&gt;folder_special&lt;/mat-icon&gt;
    &lt;mat-icon&gt;font_download&lt;/mat-icon&gt;
    &lt;mat-icon&gt;format_align_center&lt;/mat-icon&gt;
    &lt;mat-icon&gt;format_align_justify&lt;/mat-icon&gt;
    &lt;mat-icon&gt;format_align_left&lt;/mat-icon&gt;
    &lt;mat-icon&gt;format_align_right&lt;/mat-icon&gt;
    &lt;mat-icon&gt;format_bold&lt;/mat-icon&gt;
    &lt;mat-icon&gt;format_clear&lt;/mat-icon&gt;
    &lt;mat-icon&gt;format_color_fill&lt;/mat-icon&gt;
    &lt;mat-icon&gt;format_color_reset&lt;/mat-icon&gt;
    &lt;mat-icon&gt;format_color_text&lt;/mat-icon&gt;
    &lt;mat-icon&gt;format_indent_decrease&lt;/mat-icon&gt;
    &lt;mat-icon&gt;format_indent_increase&lt;/mat-icon&gt;
    &lt;mat-icon&gt;format_italic&lt;/mat-icon&gt;
    &lt;mat-icon&gt;format_line_spacing&lt;/mat-icon&gt;
    &lt;mat-icon&gt;format_list_bulleted&lt;/mat-icon&gt;
    &lt;mat-icon&gt;format_list_numbered&lt;/mat-icon&gt;
    &lt;mat-icon&gt;format_paint&lt;/mat-icon&gt;
    &lt;mat-icon&gt;format_quote&lt;/mat-icon&gt;
    &lt;mat-icon&gt;format_size&lt;/mat-icon&gt;
    &lt;mat-icon&gt;format_strikethrough&lt;/mat-icon&gt;
    &lt;mat-icon&gt;format_textdirection_l_to_r&lt;/mat-icon&gt;
    &lt;mat-icon&gt;format_textdirection_r_to_l&lt;/mat-icon&gt;
    &lt;mat-icon&gt;format_underlined&lt;/mat-icon&gt;
    &lt;mat-icon&gt;forum&lt;/mat-icon&gt;
    &lt;mat-icon&gt;forward&lt;/mat-icon&gt;
    &lt;mat-icon&gt;forward_10&lt;/mat-icon&gt;
    &lt;mat-icon&gt;forward_30&lt;/mat-icon&gt;
    &lt;mat-icon&gt;forward_5&lt;/mat-icon&gt;
    &lt;mat-icon&gt;fullscreen&lt;/mat-icon&gt;
    &lt;mat-icon&gt;fullscreen_exit&lt;/mat-icon&gt;
    &lt;mat-icon&gt;functions&lt;/mat-icon&gt;
    &lt;mat-icon&gt;gamepad&lt;/mat-icon&gt;
    &lt;mat-icon&gt;games&lt;/mat-icon&gt;
    &lt;mat-icon&gt;gesture&lt;/mat-icon&gt;
    &lt;mat-icon&gt;get_app&lt;/mat-icon&gt;
    &lt;mat-icon&gt;gif&lt;/mat-icon&gt;
    &lt;mat-icon&gt;gps_fixed&lt;/mat-icon&gt;
    &lt;mat-icon&gt;gps_not_fixed&lt;/mat-icon&gt;
    &lt;mat-icon&gt;gps_off&lt;/mat-icon&gt;
    &lt;mat-icon&gt;grade&lt;/mat-icon&gt;
    &lt;mat-icon&gt;gradient&lt;/mat-icon&gt;
    &lt;mat-icon&gt;grain&lt;/mat-icon&gt;
    &lt;mat-icon&gt;graphic_eq&lt;/mat-icon&gt;
    &lt;mat-icon&gt;grid_off&lt;/mat-icon&gt;
    &lt;mat-icon&gt;grid_on&lt;/mat-icon&gt;
    &lt;mat-icon&gt;group&lt;/mat-icon&gt;
    &lt;mat-icon&gt;group_add&lt;/mat-icon&gt;
    &lt;mat-icon&gt;group_work&lt;/mat-icon&gt;
    &lt;mat-icon&gt;hd&lt;/mat-icon&gt;
    &lt;mat-icon&gt;hdr_off&lt;/mat-icon&gt;
    &lt;mat-icon&gt;hdr_on&lt;/mat-icon&gt;
    &lt;mat-icon&gt;hdr_strong&lt;/mat-icon&gt;
    &lt;mat-icon&gt;hdr_weak&lt;/mat-icon&gt;
    &lt;mat-icon&gt;headset&lt;/mat-icon&gt;
    &lt;mat-icon&gt;headset_mic&lt;/mat-icon&gt;
    &lt;mat-icon&gt;healing&lt;/mat-icon&gt;
    &lt;mat-icon&gt;hearing&lt;/mat-icon&gt;
    &lt;mat-icon&gt;help&lt;/mat-icon&gt;
    &lt;mat-icon&gt;help_outline&lt;/mat-icon&gt;
    &lt;mat-icon&gt;high_quality&lt;/mat-icon&gt;
    &lt;mat-icon&gt;highlight_off&lt;/mat-icon&gt;
    &lt;mat-icon&gt;history&lt;/mat-icon&gt;
    &lt;mat-icon&gt;home&lt;/mat-icon&gt;
    &lt;mat-icon&gt;hotel&lt;/mat-icon&gt;
    &lt;mat-icon&gt;hourglass_empty&lt;/mat-icon&gt;
    &lt;mat-icon&gt;hourglass_full&lt;/mat-icon&gt;
    &lt;mat-icon&gt;http&lt;/mat-icon&gt;
    &lt;mat-icon&gt;https&lt;/mat-icon&gt;
    &lt;mat-icon&gt;image&lt;/mat-icon&gt;
    &lt;mat-icon&gt;image_aspect_ratio&lt;/mat-icon&gt;
    &lt;mat-icon&gt;import_export&lt;/mat-icon&gt;
    &lt;mat-icon&gt;inbox&lt;/mat-icon&gt;
    &lt;mat-icon&gt;indeterminate_check_box&lt;/mat-icon&gt;
    &lt;mat-icon&gt;info&lt;/mat-icon&gt;
    &lt;mat-icon&gt;info_outline&lt;/mat-icon&gt;
    &lt;mat-icon&gt;input&lt;/mat-icon&gt;
    &lt;mat-icon&gt;insert_chart&lt;/mat-icon&gt;
    &lt;mat-icon&gt;insert_comment&lt;/mat-icon&gt;
    &lt;mat-icon&gt;insert_drive_file&lt;/mat-icon&gt;
    &lt;mat-icon&gt;insert_emoticon&lt;/mat-icon&gt;
    &lt;mat-icon&gt;insert_invitation&lt;/mat-icon&gt;
    &lt;mat-icon&gt;insert_link&lt;/mat-icon&gt;
    &lt;mat-icon&gt;insert_photo&lt;/mat-icon&gt;
    &lt;mat-icon&gt;invert_colors&lt;/mat-icon&gt;
    &lt;mat-icon&gt;invert_colors_off&lt;/mat-icon&gt;
    &lt;mat-icon&gt;iso&lt;/mat-icon&gt;
    &lt;mat-icon&gt;keyboard&lt;/mat-icon&gt;
    &lt;mat-icon&gt;keyboard_arrow_down&lt;/mat-icon&gt;
    &lt;mat-icon&gt;keyboard_arrow_left&lt;/mat-icon&gt;
    &lt;mat-icon&gt;keyboard_arrow_right&lt;/mat-icon&gt;
    &lt;mat-icon&gt;keyboard_arrow_up&lt;/mat-icon&gt;
    &lt;mat-icon&gt;keyboard_backspace&lt;/mat-icon&gt;
    &lt;mat-icon&gt;keyboard_capslock&lt;/mat-icon&gt;
    &lt;mat-icon&gt;keyboard_hide&lt;/mat-icon&gt;
    &lt;mat-icon&gt;keyboard_return&lt;/mat-icon&gt;
    &lt;mat-icon&gt;keyboard_tab&lt;/mat-icon&gt;
    &lt;mat-icon&gt;keyboard_voice&lt;/mat-icon&gt;
    &lt;mat-icon&gt;label&lt;/mat-icon&gt;
    &lt;mat-icon&gt;label_outline&lt;/mat-icon&gt;
    &lt;mat-icon&gt;landscape&lt;/mat-icon&gt;
    &lt;mat-icon&gt;language&lt;/mat-icon&gt;
    &lt;mat-icon&gt;laptop&lt;/mat-icon&gt;
    &lt;mat-icon&gt;laptop_chromebook&lt;/mat-icon&gt;
    &lt;mat-icon&gt;laptop_mac&lt;/mat-icon&gt;
    &lt;mat-icon&gt;laptop_windows&lt;/mat-icon&gt;
    &lt;mat-icon&gt;launch&lt;/mat-icon&gt;
    &lt;mat-icon&gt;layers&lt;/mat-icon&gt;
    &lt;mat-icon&gt;layers_clear&lt;/mat-icon&gt;
    &lt;mat-icon&gt;leak_add&lt;/mat-icon&gt;
    &lt;mat-icon&gt;leak_remove&lt;/mat-icon&gt;
    &lt;mat-icon&gt;lens&lt;/mat-icon&gt;
    &lt;mat-icon&gt;library_add&lt;/mat-icon&gt;
    &lt;mat-icon&gt;library_books&lt;/mat-icon&gt;
    &lt;mat-icon&gt;library_music&lt;/mat-icon&gt;
    &lt;mat-icon&gt;link&lt;/mat-icon&gt;
    &lt;mat-icon&gt;list&lt;/mat-icon&gt;
    &lt;mat-icon&gt;live_help&lt;/mat-icon&gt;
    &lt;mat-icon&gt;live_tv&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_activity&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_airport&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_atm&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_bar&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_cafe&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_car_wash&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_convenience_store&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_dining&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_drink&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_florist&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_gas_station&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_grocery_store&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_hospital&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_hotel&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_laundry_service&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_library&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_mall&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_movies&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_offer&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_parking&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_pharmacy&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_phone&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_pizza&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_play&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_post_office&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_printshop&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_see&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_shipping&lt;/mat-icon&gt;
    &lt;mat-icon&gt;local_taxi&lt;/mat-icon&gt;
    &lt;mat-icon&gt;location_city&lt;/mat-icon&gt;
    &lt;mat-icon&gt;location_disabled&lt;/mat-icon&gt;
    &lt;mat-icon&gt;location_off&lt;/mat-icon&gt;
    &lt;mat-icon&gt;location_on&lt;/mat-icon&gt;
    &lt;mat-icon&gt;location_searching&lt;/mat-icon&gt;
    &lt;mat-icon&gt;lock&lt;/mat-icon&gt;
    &lt;mat-icon&gt;lock_open&lt;/mat-icon&gt;
    &lt;mat-icon&gt;lock_outline&lt;/mat-icon&gt;
    &lt;mat-icon&gt;looks&lt;/mat-icon&gt;
    &lt;mat-icon&gt;looks_3&lt;/mat-icon&gt;
    &lt;mat-icon&gt;looks_4&lt;/mat-icon&gt;
    &lt;mat-icon&gt;looks_5&lt;/mat-icon&gt;
    &lt;mat-icon&gt;looks_6&lt;/mat-icon&gt;
    &lt;mat-icon&gt;looks_one&lt;/mat-icon&gt;
    &lt;mat-icon&gt;looks_two&lt;/mat-icon&gt;
    &lt;mat-icon&gt;loop&lt;/mat-icon&gt;
    &lt;mat-icon&gt;loupe&lt;/mat-icon&gt;
    &lt;mat-icon&gt;loyalty&lt;/mat-icon&gt;
    &lt;mat-icon&gt;mail&lt;/mat-icon&gt;
    &lt;mat-icon&gt;map&lt;/mat-icon&gt;
    &lt;mat-icon&gt;markunread&lt;/mat-icon&gt;
    &lt;mat-icon&gt;markunread_mailbox&lt;/mat-icon&gt;
    &lt;mat-icon&gt;memory&lt;/mat-icon&gt;
    &lt;mat-icon&gt;menu&lt;/mat-icon&gt;
    &lt;mat-icon&gt;merge_type&lt;/mat-icon&gt;
    &lt;mat-icon&gt;message&lt;/mat-icon&gt;
    &lt;mat-icon&gt;mic&lt;/mat-icon&gt;
    &lt;mat-icon&gt;mic_none&lt;/mat-icon&gt;
    &lt;mat-icon&gt;mic_off&lt;/mat-icon&gt;
    &lt;mat-icon&gt;mms&lt;/mat-icon&gt;
    &lt;mat-icon&gt;mode_comment&lt;/mat-icon&gt;
    &lt;mat-icon&gt;mode_edit&lt;/mat-icon&gt;
    &lt;mat-icon&gt;money_off&lt;/mat-icon&gt;
    &lt;mat-icon&gt;monochrome_photos&lt;/mat-icon&gt;
    &lt;mat-icon&gt;mood&lt;/mat-icon&gt;
    &lt;mat-icon&gt;mood_bad&lt;/mat-icon&gt;
    &lt;mat-icon&gt;more&lt;/mat-icon&gt;
    &lt;mat-icon&gt;more_horiz&lt;/mat-icon&gt;
    &lt;mat-icon&gt;more_vert&lt;/mat-icon&gt;
    &lt;mat-icon&gt;mouse&lt;/mat-icon&gt;
    &lt;mat-icon&gt;movie&lt;/mat-icon&gt;
    &lt;mat-icon&gt;movie_creation&lt;/mat-icon&gt;
    &lt;mat-icon&gt;music_note&lt;/mat-icon&gt;
    &lt;mat-icon&gt;my_location&lt;/mat-icon&gt;
    &lt;mat-icon&gt;nature&lt;/mat-icon&gt;
    &lt;mat-icon&gt;nature_people&lt;/mat-icon&gt;
    &lt;mat-icon&gt;navigate_before&lt;/mat-icon&gt;
    &lt;mat-icon&gt;navigate_next&lt;/mat-icon&gt;
    &lt;mat-icon&gt;navigation&lt;/mat-icon&gt;
    &lt;mat-icon&gt;network_cell&lt;/mat-icon&gt;
    &lt;mat-icon&gt;network_locked&lt;/mat-icon&gt;
    &lt;mat-icon&gt;network_wifi&lt;/mat-icon&gt;
    &lt;mat-icon&gt;new_releases&lt;/mat-icon&gt;
    &lt;mat-icon&gt;nfc&lt;/mat-icon&gt;
    &lt;mat-icon&gt;no_sim&lt;/mat-icon&gt;
    &lt;mat-icon&gt;not_interested&lt;/mat-icon&gt;
    &lt;mat-icon&gt;note_add&lt;/mat-icon&gt;
    &lt;mat-icon&gt;notifications&lt;/mat-icon&gt;
    &lt;mat-icon&gt;notifications_active&lt;/mat-icon&gt;
    &lt;mat-icon&gt;notifications_none&lt;/mat-icon&gt;
    &lt;mat-icon&gt;notifications_off&lt;/mat-icon&gt;
    &lt;mat-icon&gt;notifications_paused&lt;/mat-icon&gt;
    &lt;mat-icon&gt;offline_pin&lt;/mat-icon&gt;
    &lt;mat-icon&gt;ondemand_video&lt;/mat-icon&gt;
    &lt;mat-icon&gt;open_in_browser&lt;/mat-icon&gt;
    &lt;mat-icon&gt;open_in_new&lt;/mat-icon&gt;
    &lt;mat-icon&gt;open_with&lt;/mat-icon&gt;
    &lt;mat-icon&gt;pages&lt;/mat-icon&gt;
    &lt;mat-icon&gt;pageview&lt;/mat-icon&gt;
    &lt;mat-icon&gt;palette&lt;/mat-icon&gt;
    &lt;mat-icon&gt;panorama&lt;/mat-icon&gt;
    &lt;mat-icon&gt;panorama_fish_eye&lt;/mat-icon&gt;
    &lt;mat-icon&gt;panorama_horizontal&lt;/mat-icon&gt;
    &lt;mat-icon&gt;panorama_vertical&lt;/mat-icon&gt;
    &lt;mat-icon&gt;panorama_wide_angle&lt;/mat-icon&gt;
    &lt;mat-icon&gt;party_mode&lt;/mat-icon&gt;
    &lt;mat-icon&gt;pause&lt;/mat-icon&gt;
    &lt;mat-icon&gt;pause_circle_filled&lt;/mat-icon&gt;
    &lt;mat-icon&gt;pause_circle_outline&lt;/mat-icon&gt;
    &lt;mat-icon&gt;payment&lt;/mat-icon&gt;
    &lt;mat-icon&gt;people&lt;/mat-icon&gt;
    &lt;mat-icon&gt;people_outline&lt;/mat-icon&gt;
    &lt;mat-icon&gt;perm_camera_mic&lt;/mat-icon&gt;
    &lt;mat-icon&gt;perm_contact_calendar&lt;/mat-icon&gt;
    &lt;mat-icon&gt;perm_data_setting&lt;/mat-icon&gt;
    &lt;mat-icon&gt;perm_device_information&lt;/mat-icon&gt;
    &lt;mat-icon&gt;perm_identity&lt;/mat-icon&gt;
    &lt;mat-icon&gt;perm_media&lt;/mat-icon&gt;
    &lt;mat-icon&gt;perm_phone_msg&lt;/mat-icon&gt;
    &lt;mat-icon&gt;perm_scan_wifi&lt;/mat-icon&gt;
    &lt;mat-icon&gt;person&lt;/mat-icon&gt;
    &lt;mat-icon&gt;person_add&lt;/mat-icon&gt;
    &lt;mat-icon&gt;person_outline&lt;/mat-icon&gt;
    &lt;mat-icon&gt;person_pin&lt;/mat-icon&gt;
    &lt;mat-icon&gt;personal_video&lt;/mat-icon&gt;
    &lt;mat-icon&gt;phone&lt;/mat-icon&gt;
    &lt;mat-icon&gt;phone_android&lt;/mat-icon&gt;
    &lt;mat-icon&gt;phone_bluetooth_speaker&lt;/mat-icon&gt;
    &lt;mat-icon&gt;phone_forwarded&lt;/mat-icon&gt;
    &lt;mat-icon&gt;phone_in_talk&lt;/mat-icon&gt;
    &lt;mat-icon&gt;phone_iphone&lt;/mat-icon&gt;
    &lt;mat-icon&gt;phone_locked&lt;/mat-icon&gt;
    &lt;mat-icon&gt;phone_missed&lt;/mat-icon&gt;
    &lt;mat-icon&gt;phone_paused&lt;/mat-icon&gt;
    &lt;mat-icon&gt;phonelink&lt;/mat-icon&gt;
    &lt;mat-icon&gt;phonelink_erase&lt;/mat-icon&gt;
    &lt;mat-icon&gt;phonelink_lock&lt;/mat-icon&gt;
    &lt;mat-icon&gt;phonelink_off&lt;/mat-icon&gt;
    &lt;mat-icon&gt;phonelink_ring&lt;/mat-icon&gt;
    &lt;mat-icon&gt;phonelink_setup&lt;/mat-icon&gt;
    &lt;mat-icon&gt;photo&lt;/mat-icon&gt;
    &lt;mat-icon&gt;photo_album&lt;/mat-icon&gt;
    &lt;mat-icon&gt;photo_camera&lt;/mat-icon&gt;
    &lt;mat-icon&gt;photo_library&lt;/mat-icon&gt;
    &lt;mat-icon&gt;photo_size_select_actual&lt;/mat-icon&gt;
    &lt;mat-icon&gt;photo_size_select_large&lt;/mat-icon&gt;
    &lt;mat-icon&gt;photo_size_select_small&lt;/mat-icon&gt;
    &lt;mat-icon&gt;picture_as_pdf&lt;/mat-icon&gt;
    &lt;mat-icon&gt;picture_in_picture&lt;/mat-icon&gt;
    &lt;mat-icon&gt;pin_drop&lt;/mat-icon&gt;
    &lt;mat-icon&gt;place&lt;/mat-icon&gt;
    &lt;mat-icon&gt;play_arrow&lt;/mat-icon&gt;
    &lt;mat-icon&gt;play_circle_filled&lt;/mat-icon&gt;
    &lt;mat-icon&gt;play_circle_outline&lt;/mat-icon&gt;
    &lt;mat-icon&gt;play_for_work&lt;/mat-icon&gt;
    &lt;mat-icon&gt;playlist_add&lt;/mat-icon&gt;
    &lt;mat-icon&gt;plus_one&lt;/mat-icon&gt;
    &lt;mat-icon&gt;poll&lt;/mat-icon&gt;
    &lt;mat-icon&gt;polymer&lt;/mat-icon&gt;
    &lt;mat-icon&gt;portable_wifi_off&lt;/mat-icon&gt;
    &lt;mat-icon&gt;portrait&lt;/mat-icon&gt;
    &lt;mat-icon&gt;power&lt;/mat-icon&gt;
    &lt;mat-icon&gt;power_input&lt;/mat-icon&gt;
    &lt;mat-icon&gt;power_settings_new&lt;/mat-icon&gt;
    &lt;mat-icon&gt;present_to_all&lt;/mat-icon&gt;
    &lt;mat-icon&gt;print&lt;/mat-icon&gt;
    &lt;mat-icon&gt;public&lt;/mat-icon&gt;
    &lt;mat-icon&gt;publish&lt;/mat-icon&gt;
    &lt;mat-icon&gt;query_builder&lt;/mat-icon&gt;
    &lt;mat-icon&gt;question_answer&lt;/mat-icon&gt;
    &lt;mat-icon&gt;queue&lt;/mat-icon&gt;
    &lt;mat-icon&gt;queue_music&lt;/mat-icon&gt;
    &lt;mat-icon&gt;radio&lt;/mat-icon&gt;
    &lt;mat-icon&gt;radio_button_checked&lt;/mat-icon&gt;
    &lt;mat-icon&gt;radio_button_unchecked&lt;/mat-icon&gt;
    &lt;mat-icon&gt;rate_review&lt;/mat-icon&gt;
    &lt;mat-icon&gt;receipt&lt;/mat-icon&gt;
    &lt;mat-icon&gt;recent_actors&lt;/mat-icon&gt;
    &lt;mat-icon&gt;redeem&lt;/mat-icon&gt;
    &lt;mat-icon&gt;redo&lt;/mat-icon&gt;
    &lt;mat-icon&gt;refresh&lt;/mat-icon&gt;
    &lt;mat-icon&gt;remove&lt;/mat-icon&gt;
    &lt;mat-icon&gt;remove_circle&lt;/mat-icon&gt;
    &lt;mat-icon&gt;remove_circle_outline&lt;/mat-icon&gt;
    &lt;mat-icon&gt;remove_red_eye&lt;/mat-icon&gt;
    &lt;mat-icon&gt;reorder&lt;/mat-icon&gt;
    &lt;mat-icon&gt;repeat&lt;/mat-icon&gt;
    &lt;mat-icon&gt;repeat_one&lt;/mat-icon&gt;
    &lt;mat-icon&gt;replay&lt;/mat-icon&gt;
    &lt;mat-icon&gt;replay_10&lt;/mat-icon&gt;
    &lt;mat-icon&gt;replay_30&lt;/mat-icon&gt;
    &lt;mat-icon&gt;replay_5&lt;/mat-icon&gt;
    &lt;mat-icon&gt;reply&lt;/mat-icon&gt;
    &lt;mat-icon&gt;reply_all&lt;/mat-icon&gt;
    &lt;mat-icon&gt;report&lt;/mat-icon&gt;
    &lt;mat-icon&gt;report_problem&lt;/mat-icon&gt;
    &lt;mat-icon&gt;restaurant_menu&lt;/mat-icon&gt;
    &lt;mat-icon&gt;restore&lt;/mat-icon&gt;
    &lt;mat-icon&gt;ring_volume&lt;/mat-icon&gt;
    &lt;mat-icon&gt;room&lt;/mat-icon&gt;
    &lt;mat-icon&gt;rotate_90_degrees_ccw&lt;/mat-icon&gt;
    &lt;mat-icon&gt;rotate_left&lt;/mat-icon&gt;
    &lt;mat-icon&gt;rotate_right&lt;/mat-icon&gt;
    &lt;mat-icon&gt;router&lt;/mat-icon&gt;
    &lt;mat-icon&gt;satellite&lt;/mat-icon&gt;
    &lt;mat-icon&gt;save&lt;/mat-icon&gt;
    &lt;mat-icon&gt;scanner&lt;/mat-icon&gt;
    &lt;mat-icon&gt;schedule&lt;/mat-icon&gt;
    &lt;mat-icon&gt;school&lt;/mat-icon&gt;
    &lt;mat-icon&gt;screen_lock_landscape&lt;/mat-icon&gt;
    &lt;mat-icon&gt;screen_lock_portrait&lt;/mat-icon&gt;
    &lt;mat-icon&gt;screen_lock_rotation&lt;/mat-icon&gt;
    &lt;mat-icon&gt;screen_rotation&lt;/mat-icon&gt;
    &lt;mat-icon&gt;sd_card&lt;/mat-icon&gt;
    &lt;mat-icon&gt;sd_storage&lt;/mat-icon&gt;
    &lt;mat-icon&gt;search&lt;/mat-icon&gt;
    &lt;mat-icon&gt;security&lt;/mat-icon&gt;
    &lt;mat-icon&gt;select_all&lt;/mat-icon&gt;
    &lt;mat-icon&gt;send&lt;/mat-icon&gt;
    &lt;mat-icon&gt;settings&lt;/mat-icon&gt;
    &lt;mat-icon&gt;settings_applications&lt;/mat-icon&gt;
    &lt;mat-icon&gt;settings_backup_restore&lt;/mat-icon&gt;
    &lt;mat-icon&gt;settings_bluetooth&lt;/mat-icon&gt;
    &lt;mat-icon&gt;settings_brightness&lt;/mat-icon&gt;
    &lt;mat-icon&gt;settings_cell&lt;/mat-icon&gt;
    &lt;mat-icon&gt;settings_ethernet&lt;/mat-icon&gt;
    &lt;mat-icon&gt;settings_input_antenna&lt;/mat-icon&gt;
    &lt;mat-icon&gt;settings_input_component&lt;/mat-icon&gt;
    &lt;mat-icon&gt;settings_input_composite&lt;/mat-icon&gt;
    &lt;mat-icon&gt;settings_input_hdmi&lt;/mat-icon&gt;
    &lt;mat-icon&gt;settings_input_svideo&lt;/mat-icon&gt;
    &lt;mat-icon&gt;settings_overscan&lt;/mat-icon&gt;
    &lt;mat-icon&gt;settings_phone&lt;/mat-icon&gt;
    &lt;mat-icon&gt;settings_power&lt;/mat-icon&gt;
    &lt;mat-icon&gt;settings_remote&lt;/mat-icon&gt;
    &lt;mat-icon&gt;settings_system_daydream&lt;/mat-icon&gt;
    &lt;mat-icon&gt;settings_voice&lt;/mat-icon&gt;
    &lt;mat-icon&gt;share&lt;/mat-icon&gt;
    &lt;mat-icon&gt;shop&lt;/mat-icon&gt;
    &lt;mat-icon&gt;shop_two&lt;/mat-icon&gt;
    &lt;mat-icon&gt;shopping_basket&lt;/mat-icon&gt;
    &lt;mat-icon&gt;shopping_cart&lt;/mat-icon&gt;
    &lt;mat-icon&gt;shuffle&lt;/mat-icon&gt;
    &lt;mat-icon&gt;signal_cellular_4_bar&lt;/mat-icon&gt;
    &lt;mat-icon&gt;signal_cellular_connected_no_internet_4_bar&lt;/mat-icon&gt;
    &lt;mat-icon&gt;signal_cellular_no_sim&lt;/mat-icon&gt;
    &lt;mat-icon&gt;signal_cellular_null&lt;/mat-icon&gt;
    &lt;mat-icon&gt;signal_cellular_off&lt;/mat-icon&gt;
    &lt;mat-icon&gt;signal_wifi_4_bar&lt;/mat-icon&gt;
    &lt;mat-icon&gt;signal_wifi_4_bar_lock&lt;/mat-icon&gt;
    &lt;mat-icon&gt;signal_wifi_off&lt;/mat-icon&gt;
    &lt;mat-icon&gt;sim_card&lt;/mat-icon&gt;
    &lt;mat-icon&gt;sim_card_alert&lt;/mat-icon&gt;
    &lt;mat-icon&gt;skip_next&lt;/mat-icon&gt;
    &lt;mat-icon&gt;skip_previous&lt;/mat-icon&gt;
    &lt;mat-icon&gt;slideshow&lt;/mat-icon&gt;
    &lt;mat-icon&gt;smartphone&lt;/mat-icon&gt;
    &lt;mat-icon&gt;sms&lt;/mat-icon&gt;
    &lt;mat-icon&gt;sms_failed&lt;/mat-icon&gt;
    &lt;mat-icon&gt;snooze&lt;/mat-icon&gt;
    &lt;mat-icon&gt;sort&lt;/mat-icon&gt;
    &lt;mat-icon&gt;sort_by_alpha&lt;/mat-icon&gt;
    &lt;mat-icon&gt;space_bar&lt;/mat-icon&gt;
    &lt;mat-icon&gt;speaker&lt;/mat-icon&gt;
    &lt;mat-icon&gt;speaker_group&lt;/mat-icon&gt;
    &lt;mat-icon&gt;speaker_notes&lt;/mat-icon&gt;
    &lt;mat-icon&gt;speaker_phone&lt;/mat-icon&gt;
    &lt;mat-icon&gt;spellcheck&lt;/mat-icon&gt;
    &lt;mat-icon&gt;star&lt;/mat-icon&gt;
    &lt;mat-icon&gt;star_border&lt;/mat-icon&gt;
    &lt;mat-icon&gt;star_half&lt;/mat-icon&gt;
    &lt;mat-icon&gt;stars&lt;/mat-icon&gt;
    &lt;mat-icon&gt;stay_current_landscape&lt;/mat-icon&gt;
    &lt;mat-icon&gt;stay_current_portrait&lt;/mat-icon&gt;
    &lt;mat-icon&gt;stay_primary_landscape&lt;/mat-icon&gt;
    &lt;mat-icon&gt;stay_primary_portrait&lt;/mat-icon&gt;
    &lt;mat-icon&gt;stop&lt;/mat-icon&gt;
    &lt;mat-icon&gt;storage&lt;/mat-icon&gt;
    &lt;mat-icon&gt;store&lt;/mat-icon&gt;
    &lt;mat-icon&gt;store_mall_directory&lt;/mat-icon&gt;
    &lt;mat-icon&gt;straighten&lt;/mat-icon&gt;
    &lt;mat-icon&gt;strikethrough_s&lt;/mat-icon&gt;
    &lt;mat-icon&gt;style&lt;/mat-icon&gt;
    &lt;mat-icon&gt;subject&lt;/mat-icon&gt;
    &lt;mat-icon&gt;subtitles&lt;/mat-icon&gt;
    &lt;mat-icon&gt;supervisor_account&lt;/mat-icon&gt;
    &lt;mat-icon&gt;surround_sound&lt;/mat-icon&gt;
    &lt;mat-icon&gt;swap_calls&lt;/mat-icon&gt;
    &lt;mat-icon&gt;swap_horiz&lt;/mat-icon&gt;
    &lt;mat-icon&gt;swap_vert&lt;/mat-icon&gt;
    &lt;mat-icon&gt;swap_vertical_circle&lt;/mat-icon&gt;
    &lt;mat-icon&gt;switch_camera&lt;/mat-icon&gt;
    &lt;mat-icon&gt;switch_video&lt;/mat-icon&gt;
    &lt;mat-icon&gt;sync&lt;/mat-icon&gt;
    &lt;mat-icon&gt;sync_disabled&lt;/mat-icon&gt;
    &lt;mat-icon&gt;sync_problem&lt;/mat-icon&gt;
    &lt;mat-icon&gt;system_update&lt;/mat-icon&gt;
    &lt;mat-icon&gt;system_update_alt&lt;/mat-icon&gt;
    &lt;mat-icon&gt;tab&lt;/mat-icon&gt;
    &lt;mat-icon&gt;tab_unselected&lt;/mat-icon&gt;
    &lt;mat-icon&gt;tablet&lt;/mat-icon&gt;
    &lt;mat-icon&gt;tablet_android&lt;/mat-icon&gt;
    &lt;mat-icon&gt;tablet_mac&lt;/mat-icon&gt;
    &lt;mat-icon&gt;tag_faces&lt;/mat-icon&gt;
    &lt;mat-icon&gt;tap_and_play&lt;/mat-icon&gt;
    &lt;mat-icon&gt;terrain&lt;/mat-icon&gt;
    &lt;mat-icon&gt;text_format&lt;/mat-icon&gt;
    &lt;mat-icon&gt;textsms&lt;/mat-icon&gt;
    &lt;mat-icon&gt;texture&lt;/mat-icon&gt;
    &lt;mat-icon&gt;theaters&lt;/mat-icon&gt;
    &lt;mat-icon&gt;thumb_down&lt;/mat-icon&gt;
    &lt;mat-icon&gt;thumb_up&lt;/mat-icon&gt;
    &lt;mat-icon&gt;thumbs_up_down&lt;/mat-icon&gt;
    &lt;mat-icon&gt;time_to_leave&lt;/mat-icon&gt;
    &lt;mat-icon&gt;timelapse&lt;/mat-icon&gt;
    &lt;mat-icon&gt;timer&lt;/mat-icon&gt;
    &lt;mat-icon&gt;timer_10&lt;/mat-icon&gt;
    &lt;mat-icon&gt;timer_3&lt;/mat-icon&gt;
    &lt;mat-icon&gt;timer_off&lt;/mat-icon&gt;
    &lt;mat-icon&gt;toc&lt;/mat-icon&gt;
    &lt;mat-icon&gt;today&lt;/mat-icon&gt;
    &lt;mat-icon&gt;toll&lt;/mat-icon&gt;
    &lt;mat-icon&gt;tonality&lt;/mat-icon&gt;
    &lt;mat-icon&gt;toys&lt;/mat-icon&gt;
    &lt;mat-icon&gt;track_changes&lt;/mat-icon&gt;
    &lt;mat-icon&gt;traffic&lt;/mat-icon&gt;
    &lt;mat-icon&gt;transform&lt;/mat-icon&gt;
    &lt;mat-icon&gt;translate&lt;/mat-icon&gt;
    &lt;mat-icon&gt;trending_down&lt;/mat-icon&gt;
    &lt;mat-icon&gt;trending_flat&lt;/mat-icon&gt;
    &lt;mat-icon&gt;trending_up&lt;/mat-icon&gt;
    &lt;mat-icon&gt;tune&lt;/mat-icon&gt;
    &lt;mat-icon&gt;turned_in&lt;/mat-icon&gt;
    &lt;mat-icon&gt;turned_in_not&lt;/mat-icon&gt;
    &lt;mat-icon&gt;tv&lt;/mat-icon&gt;
    &lt;mat-icon&gt;undo&lt;/mat-icon&gt;
    &lt;mat-icon&gt;unfold_less&lt;/mat-icon&gt;
    &lt;mat-icon&gt;unfold_more&lt;/mat-icon&gt;
    &lt;mat-icon&gt;usb&lt;/mat-icon&gt;
    &lt;mat-icon&gt;verified_user&lt;/mat-icon&gt;
    &lt;mat-icon&gt;vertical_align_bottom&lt;/mat-icon&gt;
    &lt;mat-icon&gt;vertical_align_center&lt;/mat-icon&gt;
    &lt;mat-icon&gt;vertical_align_top&lt;/mat-icon&gt;
    &lt;mat-icon&gt;vibration&lt;/mat-icon&gt;
    &lt;mat-icon&gt;video_library&lt;/mat-icon&gt;
    &lt;mat-icon&gt;videocam&lt;/mat-icon&gt;
    &lt;mat-icon&gt;videocam_off&lt;/mat-icon&gt;
    &lt;mat-icon&gt;view_agenda&lt;/mat-icon&gt;
    &lt;mat-icon&gt;view_array&lt;/mat-icon&gt;
    &lt;mat-icon&gt;view_carousel&lt;/mat-icon&gt;
    &lt;mat-icon&gt;view_column&lt;/mat-icon&gt;
    &lt;mat-icon&gt;view_comfy&lt;/mat-icon&gt;
    &lt;mat-icon&gt;view_compact&lt;/mat-icon&gt;
    &lt;mat-icon&gt;view_day&lt;/mat-icon&gt;
    &lt;mat-icon&gt;view_headline&lt;/mat-icon&gt;
    &lt;mat-icon&gt;view_list&lt;/mat-icon&gt;
    &lt;mat-icon&gt;view_module&lt;/mat-icon&gt;
    &lt;mat-icon&gt;view_quilt&lt;/mat-icon&gt;
    &lt;mat-icon&gt;view_stream&lt;/mat-icon&gt;
    &lt;mat-icon&gt;view_week&lt;/mat-icon&gt;
    &lt;mat-icon&gt;vignette&lt;/mat-icon&gt;
    &lt;mat-icon&gt;visibility&lt;/mat-icon&gt;
    &lt;mat-icon&gt;visibility_off&lt;/mat-icon&gt;
    &lt;mat-icon&gt;voice_chat&lt;/mat-icon&gt;
    &lt;mat-icon&gt;voicemail&lt;/mat-icon&gt;
    &lt;mat-icon&gt;volume_down&lt;/mat-icon&gt;
    &lt;mat-icon&gt;volume_mute&lt;/mat-icon&gt;
    &lt;mat-icon&gt;volume_off&lt;/mat-icon&gt;
    &lt;mat-icon&gt;volume_up&lt;/mat-icon&gt;
    &lt;mat-icon&gt;vpn_key&lt;/mat-icon&gt;
    &lt;mat-icon&gt;vpn_lock&lt;/mat-icon&gt;
    &lt;mat-icon&gt;wallpaper&lt;/mat-icon&gt;
    &lt;mat-icon&gt;warning&lt;/mat-icon&gt;
    &lt;mat-icon&gt;watch&lt;/mat-icon&gt;
    &lt;mat-icon&gt;wb_auto&lt;/mat-icon&gt;
    &lt;mat-icon&gt;wb_cloudy&lt;/mat-icon&gt;
    &lt;mat-icon&gt;wb_incandescent&lt;/mat-icon&gt;
    &lt;mat-icon&gt;wb_iridescent&lt;/mat-icon&gt;
    &lt;mat-icon&gt;wb_sunny&lt;/mat-icon&gt;
    &lt;mat-icon&gt;wc&lt;/mat-icon&gt;
    &lt;mat-icon&gt;web&lt;/mat-icon&gt;
    &lt;mat-icon&gt;whatshot&lt;/mat-icon&gt;
    &lt;mat-icon&gt;widgets&lt;/mat-icon&gt;
    &lt;mat-icon&gt;wifi&lt;/mat-icon&gt;
    &lt;mat-icon&gt;wifi_lock&lt;/mat-icon&gt;
    &lt;mat-icon&gt;wifi_tethering&lt;/mat-icon&gt;
    &lt;mat-icon&gt;work&lt;/mat-icon&gt;
    &lt;mat-icon&gt;wrap_text&lt;/mat-icon&gt;
    &lt;mat-icon&gt;youtube_searched_for&lt;/mat-icon&gt;
    &lt;mat-icon&gt;zoom_in&lt;/mat-icon&gt;
    &lt;mat-icon&gt;zoom_out&lt;/mat-icon&gt;
  &lt;/mat-card-content&gt;
&lt;/mat-card&gt;
</code></pre>
    </div>

    <div class="tab-pane fade" id="c-tree">
        <div id="tree-container"></div>
        <div class="tree-legend">
            <div class="title">
                <b>Legend</b>
            </div>
            <div>
                <div class="color htmlelement"></div><span>Html element</span>
            </div>
            <div>
                <div class="color component"></div><span>Component</span>
            </div>
            <div>
                <div class="color directive"></div><span>Html element with directive</span>
            </div>
        </div>
    </div>
</div>

<script src="../js/libs/vis.min.js"></script>
<script src="../js/libs/htmlparser.js"></script>
<script src="../js/libs/deep-iterator.js"></script>
<script>
        var COMPONENT_TEMPLATE = '<div><mat-card>  <mat-card-title>图标</mat-card-title>  <mat-card-content>    <mat-icon>account_balance</mat-icon>    <mat-icon>account_balance_wallet</mat-icon>    <mat-icon>account_box</mat-icon>    <mat-icon>account_circle</mat-icon>    <mat-icon>adb</mat-icon>    <mat-icon>add</mat-icon>    <mat-icon>add_alarm</mat-icon>    <mat-icon>add_alert</mat-icon>    <mat-icon>add_box</mat-icon>    <mat-icon>add_circle</mat-icon>    <mat-icon>add_circle_outline</mat-icon>    <mat-icon>add_shopping_cart</mat-icon>    <mat-icon>add_to_photos</mat-icon>    <mat-icon>adjust</mat-icon>    <mat-icon>airline_seat_flat</mat-icon>    <mat-icon>airline_seat_flat_angled</mat-icon>    <mat-icon>airline_seat_individual_suite</mat-icon>    <mat-icon>airline_seat_legroom_extra</mat-icon>    <mat-icon>airline_seat_legroom_normal</mat-icon>    <mat-icon>airline_seat_legroom_reduced</mat-icon>    <mat-icon>airline_seat_recline_extra</mat-icon>    <mat-icon>airline_seat_recline_normal</mat-icon>    <mat-icon>airplanemode_active</mat-icon>    <mat-icon>airplanemode_inactive</mat-icon>    <mat-icon>airplay</mat-icon>    <mat-icon>alarm</mat-icon>    <mat-icon>alarm_add</mat-icon>    <mat-icon>alarm_off</mat-icon>    <mat-icon>alarm_on</mat-icon>    <mat-icon>album</mat-icon>    <mat-icon>android</mat-icon>    <mat-icon>announcement</mat-icon>    <mat-icon>apps</mat-icon>    <mat-icon>archive</mat-icon>    <mat-icon>arrow_back</mat-icon>    <mat-icon>arrow_drop_down</mat-icon>    <mat-icon>arrow_drop_down_circle</mat-icon>    <mat-icon>arrow_drop_up</mat-icon>    <mat-icon>arrow_forward</mat-icon>    <mat-icon>aspect_ratio</mat-icon>    <mat-icon>assessment</mat-icon>    <mat-icon>assignment</mat-icon>    <mat-icon>assignment_ind</mat-icon>    <mat-icon>assignment_late</mat-icon>    <mat-icon>assignment_return</mat-icon>    <mat-icon>assignment_returned</mat-icon>    <mat-icon>assignment_turned_in</mat-icon>    <mat-icon>assistant</mat-icon>    <mat-icon>assistant_photo</mat-icon>    <mat-icon>attach_file</mat-icon>    <mat-icon>attach_money</mat-icon>    <mat-icon>attachment</mat-icon>    <mat-icon>audiotrack</mat-icon>    <mat-icon>autorenew</mat-icon>    <mat-icon>av_timer</mat-icon>    <mat-icon>backspace</mat-icon>    <mat-icon>backup</mat-icon>    <mat-icon>battery_alert</mat-icon>    <mat-icon>battery_charging_full</mat-icon>    <mat-icon>battery_full</mat-icon>    <mat-icon>battery_std</mat-icon>    <mat-icon>battery_unknown</mat-icon>    <mat-icon>beenhere</mat-icon>    <mat-icon>block</mat-icon>    <mat-icon>bluetooth</mat-icon>    <mat-icon>bluetooth_audio</mat-icon>    <mat-icon>bluetooth_connected</mat-icon>    <mat-icon>bluetooth_disabled</mat-icon>    <mat-icon>bluetooth_searching</mat-icon>    <mat-icon>blur_circular</mat-icon>    <mat-icon>blur_linear</mat-icon>    <mat-icon>blur_off</mat-icon>    <mat-icon>blur_on</mat-icon>    <mat-icon>book</mat-icon>    <mat-icon>bookmark</mat-icon>    <mat-icon>bookmark_border</mat-icon>    <mat-icon>border_all</mat-icon>    <mat-icon>border_bottom</mat-icon>    <mat-icon>border_clear</mat-icon>    <mat-icon>border_color</mat-icon>    <mat-icon>border_horizontal</mat-icon>    <mat-icon>border_inner</mat-icon>    <mat-icon>border_left</mat-icon>    <mat-icon>border_outer</mat-icon>    <mat-icon>border_right</mat-icon>    <mat-icon>border_style</mat-icon>    <mat-icon>border_top</mat-icon>    <mat-icon>border_vertical</mat-icon>    <mat-icon>brightness_1</mat-icon>    <mat-icon>brightness_2</mat-icon>    <mat-icon>brightness_3</mat-icon>    <mat-icon>brightness_4</mat-icon>    <mat-icon>brightness_5</mat-icon>    <mat-icon>brightness_6</mat-icon>    <mat-icon>brightness_7</mat-icon>    <mat-icon>brightness_auto</mat-icon>    <mat-icon>brightness_high</mat-icon>    <mat-icon>brightness_low</mat-icon>    <mat-icon>brightness_medium</mat-icon>    <mat-icon>broken_image</mat-icon>    <mat-icon>brush</mat-icon>    <mat-icon>bug_report</mat-icon>    <mat-icon>build</mat-icon>    <mat-icon>business</mat-icon>    <mat-icon>cached</mat-icon>    <mat-icon>cake</mat-icon>    <mat-icon>call</mat-icon>    <mat-icon>call_end</mat-icon>    <mat-icon>call_made</mat-icon>    <mat-icon>call_merge</mat-icon>    <mat-icon>call_missed</mat-icon>    <mat-icon>call_received</mat-icon>    <mat-icon>call_split</mat-icon>    <mat-icon>camera</mat-icon>    <mat-icon>camera_alt</mat-icon>    <mat-icon>camera_enhance</mat-icon>    <mat-icon>camera_front</mat-icon>    <mat-icon>camera_rear</mat-icon>    <mat-icon>camera_roll</mat-icon>    <mat-icon>cancel</mat-icon>    <mat-icon>card_giftcard</mat-icon>    <mat-icon>card_membership</mat-icon>    <mat-icon>card_travel</mat-icon>    <mat-icon>cast</mat-icon>    <mat-icon>cast_connected</mat-icon>    <mat-icon>center_focus_strong</mat-icon>    <mat-icon>center_focus_weak</mat-icon>    <mat-icon>change_history</mat-icon>    <mat-icon>chat</mat-icon>    <mat-icon>chat_bubble</mat-icon>    <mat-icon>chat_bubble_outline</mat-icon>    <mat-icon>check</mat-icon>    <mat-icon>check_box</mat-icon>    <mat-icon>check_box_outline_blank</mat-icon>    <mat-icon>check_circle</mat-icon>    <mat-icon>chevron_left</mat-icon>    <mat-icon>chevron_right</mat-icon>    <mat-icon>chrome_reader_mode</mat-icon>    <mat-icon>class</mat-icon>    <mat-icon>clear</mat-icon>    <mat-icon>clear_all</mat-icon>    <mat-icon>close</mat-icon>    <mat-icon>closed_caption</mat-icon>    <mat-icon>cloud</mat-icon>    <mat-icon>cloud_circle</mat-icon>    <mat-icon>cloud_done</mat-icon>    <mat-icon>cloud_download</mat-icon>    <mat-icon>cloud_off</mat-icon>    <mat-icon>cloud_queue</mat-icon>    <mat-icon>cloud_upload</mat-icon>    <mat-icon>code</mat-icon>    <mat-icon>collections</mat-icon>    <mat-icon>collections_bookmark</mat-icon>    <mat-icon>color_lens</mat-icon>    <mat-icon>colorize</mat-icon>    <mat-icon>comment</mat-icon>    <mat-icon>compare</mat-icon>    <mat-icon>computer</mat-icon>    <mat-icon>confirmation_number</mat-icon>    <mat-icon>contact_phone</mat-icon>    <mat-icon>contacts</mat-icon>    <mat-icon>content_copy</mat-icon>    <mat-icon>content_cut</mat-icon>    <mat-icon>content_paste</mat-icon>    <mat-icon>control_point</mat-icon>    <mat-icon>control_point_duplicate</mat-icon>    <mat-icon>create</mat-icon>    <mat-icon>credit_card</mat-icon>    <mat-icon>crop</mat-icon>    <mat-icon>crop_16_9</mat-icon>    <mat-icon>crop_3_2</mat-icon>    <mat-icon>crop_5_4</mat-icon>    <mat-icon>crop_7_5</mat-icon>    <mat-icon>crop_din</mat-icon>    <mat-icon>crop_free</mat-icon>    <mat-icon>crop_landscape</mat-icon>    <mat-icon>crop_original</mat-icon>    <mat-icon>crop_portrait</mat-icon>    <mat-icon>crop_square</mat-icon>    <mat-icon>dashboard</mat-icon>    <mat-icon>data_usage</mat-icon>    <mat-icon>dehaze</mat-icon>    <mat-icon>delete</mat-icon>    <mat-icon>description</mat-icon>    <mat-icon>desktop_mac</mat-icon>    <mat-icon>desktop_windows</mat-icon>    <mat-icon>details</mat-icon>    <mat-icon>developer_board</mat-icon>    <mat-icon>developer_mode</mat-icon>    <mat-icon>device_hub</mat-icon>    <mat-icon>devices</mat-icon>    <mat-icon>dialer_sip</mat-icon>    <mat-icon>dialpad</mat-icon>    <mat-icon>directions</mat-icon>    <mat-icon>directions_bike</mat-icon>    <mat-icon>directions_boat</mat-icon>    <mat-icon>directions_bus</mat-icon>    <mat-icon>directions_car</mat-icon>    <mat-icon>directions_railway</mat-icon>    <mat-icon>directions_run</mat-icon>    <mat-icon>directions_subway</mat-icon>    <mat-icon>directions_transit</mat-icon>    <mat-icon>directions_walk</mat-icon>    <mat-icon>disc_full</mat-icon>    <mat-icon>dns</mat-icon>    <mat-icon>do_not_disturb</mat-icon>    <mat-icon>do_not_disturb_alt</mat-icon>    <mat-icon>dock</mat-icon>    <mat-icon>domain</mat-icon>    <mat-icon>done</mat-icon>    <mat-icon>done_all</mat-icon>    <mat-icon>drafts</mat-icon>    <mat-icon>drive_eta</mat-icon>    <mat-icon>dvr</mat-icon>    <mat-icon>edit</mat-icon>    <mat-icon>eject</mat-icon>    <mat-icon>email</mat-icon>    <mat-icon>equalizer</mat-icon>    <mat-icon>error</mat-icon>    <mat-icon>error_outline</mat-icon>    <mat-icon>event</mat-icon>    <mat-icon>event_available</mat-icon>    <mat-icon>event_busy</mat-icon>    <mat-icon>event_note</mat-icon>    <mat-icon>event_seat</mat-icon>    <mat-icon>exit_to_app</mat-icon>    <mat-icon>expand_less</mat-icon>    <mat-icon>expand_more</mat-icon>    <mat-icon>explicit</mat-icon>    <mat-icon>explore</mat-icon>    <mat-icon>exposure</mat-icon>    <mat-icon>exposure_neg_1</mat-icon>    <mat-icon>exposure_neg_2</mat-icon>    <mat-icon>exposure_plus_1</mat-icon>    <mat-icon>exposure_plus_2</mat-icon>    <mat-icon>exposure_zero</mat-icon>    <mat-icon>extension</mat-icon>    <mat-icon>face</mat-icon>    <mat-icon>fast_forward</mat-icon>    <mat-icon>fast_rewind</mat-icon>    <mat-icon>favorite</mat-icon>    <mat-icon>favorite_border</mat-icon>    <mat-icon>feedback</mat-icon>    <mat-icon>file_download</mat-icon>    <mat-icon>file_upload</mat-icon>    <mat-icon>filter</mat-icon>    <mat-icon>filter_1</mat-icon>    <mat-icon>filter_2</mat-icon>    <mat-icon>filter_3</mat-icon>    <mat-icon>filter_4</mat-icon>    <mat-icon>filter_5</mat-icon>    <mat-icon>filter_6</mat-icon>    <mat-icon>filter_7</mat-icon>    <mat-icon>filter_8</mat-icon>    <mat-icon>filter_9</mat-icon>    <mat-icon>filter_9_plus</mat-icon>    <mat-icon>filter_b_and_w</mat-icon>    <mat-icon>filter_center_focus</mat-icon>    <mat-icon>filter_drama</mat-icon>    <mat-icon>filter_frames</mat-icon>    <mat-icon>filter_hdr</mat-icon>    <mat-icon>filter_list</mat-icon>    <mat-icon>filter_none</mat-icon>    <mat-icon>filter_tilt_shift</mat-icon>    <mat-icon>filter_vintage</mat-icon>    <mat-icon>find_in_page</mat-icon>    <mat-icon>find_replace</mat-icon>    <mat-icon>flag</mat-icon>    <mat-icon>flare</mat-icon>    <mat-icon>flash_auto</mat-icon>    <mat-icon>flash_off</mat-icon>    <mat-icon>flash_on</mat-icon>    <mat-icon>flight</mat-icon>    <mat-icon>flight_land</mat-icon>    <mat-icon>flight_takeoff</mat-icon>    <mat-icon>flip</mat-icon>    <mat-icon>flip_to_back</mat-icon>    <mat-icon>flip_to_front</mat-icon>    <mat-icon>folder</mat-icon>    <mat-icon>folder_open</mat-icon>    <mat-icon>folder_shared</mat-icon>    <mat-icon>folder_special</mat-icon>    <mat-icon>font_download</mat-icon>    <mat-icon>format_align_center</mat-icon>    <mat-icon>format_align_justify</mat-icon>    <mat-icon>format_align_left</mat-icon>    <mat-icon>format_align_right</mat-icon>    <mat-icon>format_bold</mat-icon>    <mat-icon>format_clear</mat-icon>    <mat-icon>format_color_fill</mat-icon>    <mat-icon>format_color_reset</mat-icon>    <mat-icon>format_color_text</mat-icon>    <mat-icon>format_indent_decrease</mat-icon>    <mat-icon>format_indent_increase</mat-icon>    <mat-icon>format_italic</mat-icon>    <mat-icon>format_line_spacing</mat-icon>    <mat-icon>format_list_bulleted</mat-icon>    <mat-icon>format_list_numbered</mat-icon>    <mat-icon>format_paint</mat-icon>    <mat-icon>format_quote</mat-icon>    <mat-icon>format_size</mat-icon>    <mat-icon>format_strikethrough</mat-icon>    <mat-icon>format_textdirection_l_to_r</mat-icon>    <mat-icon>format_textdirection_r_to_l</mat-icon>    <mat-icon>format_underlined</mat-icon>    <mat-icon>forum</mat-icon>    <mat-icon>forward</mat-icon>    <mat-icon>forward_10</mat-icon>    <mat-icon>forward_30</mat-icon>    <mat-icon>forward_5</mat-icon>    <mat-icon>fullscreen</mat-icon>    <mat-icon>fullscreen_exit</mat-icon>    <mat-icon>functions</mat-icon>    <mat-icon>gamepad</mat-icon>    <mat-icon>games</mat-icon>    <mat-icon>gesture</mat-icon>    <mat-icon>get_app</mat-icon>    <mat-icon>gif</mat-icon>    <mat-icon>gps_fixed</mat-icon>    <mat-icon>gps_not_fixed</mat-icon>    <mat-icon>gps_off</mat-icon>    <mat-icon>grade</mat-icon>    <mat-icon>gradient</mat-icon>    <mat-icon>grain</mat-icon>    <mat-icon>graphic_eq</mat-icon>    <mat-icon>grid_off</mat-icon>    <mat-icon>grid_on</mat-icon>    <mat-icon>group</mat-icon>    <mat-icon>group_add</mat-icon>    <mat-icon>group_work</mat-icon>    <mat-icon>hd</mat-icon>    <mat-icon>hdr_off</mat-icon>    <mat-icon>hdr_on</mat-icon>    <mat-icon>hdr_strong</mat-icon>    <mat-icon>hdr_weak</mat-icon>    <mat-icon>headset</mat-icon>    <mat-icon>headset_mic</mat-icon>    <mat-icon>healing</mat-icon>    <mat-icon>hearing</mat-icon>    <mat-icon>help</mat-icon>    <mat-icon>help_outline</mat-icon>    <mat-icon>high_quality</mat-icon>    <mat-icon>highlight_off</mat-icon>    <mat-icon>history</mat-icon>    <mat-icon>home</mat-icon>    <mat-icon>hotel</mat-icon>    <mat-icon>hourglass_empty</mat-icon>    <mat-icon>hourglass_full</mat-icon>    <mat-icon>http</mat-icon>    <mat-icon>https</mat-icon>    <mat-icon>image</mat-icon>    <mat-icon>image_aspect_ratio</mat-icon>    <mat-icon>import_export</mat-icon>    <mat-icon>inbox</mat-icon>    <mat-icon>indeterminate_check_box</mat-icon>    <mat-icon>info</mat-icon>    <mat-icon>info_outline</mat-icon>    <mat-icon>input</mat-icon>    <mat-icon>insert_chart</mat-icon>    <mat-icon>insert_comment</mat-icon>    <mat-icon>insert_drive_file</mat-icon>    <mat-icon>insert_emoticon</mat-icon>    <mat-icon>insert_invitation</mat-icon>    <mat-icon>insert_link</mat-icon>    <mat-icon>insert_photo</mat-icon>    <mat-icon>invert_colors</mat-icon>    <mat-icon>invert_colors_off</mat-icon>    <mat-icon>iso</mat-icon>    <mat-icon>keyboard</mat-icon>    <mat-icon>keyboard_arrow_down</mat-icon>    <mat-icon>keyboard_arrow_left</mat-icon>    <mat-icon>keyboard_arrow_right</mat-icon>    <mat-icon>keyboard_arrow_up</mat-icon>    <mat-icon>keyboard_backspace</mat-icon>    <mat-icon>keyboard_capslock</mat-icon>    <mat-icon>keyboard_hide</mat-icon>    <mat-icon>keyboard_return</mat-icon>    <mat-icon>keyboard_tab</mat-icon>    <mat-icon>keyboard_voice</mat-icon>    <mat-icon>label</mat-icon>    <mat-icon>label_outline</mat-icon>    <mat-icon>landscape</mat-icon>    <mat-icon>language</mat-icon>    <mat-icon>laptop</mat-icon>    <mat-icon>laptop_chromebook</mat-icon>    <mat-icon>laptop_mac</mat-icon>    <mat-icon>laptop_windows</mat-icon>    <mat-icon>launch</mat-icon>    <mat-icon>layers</mat-icon>    <mat-icon>layers_clear</mat-icon>    <mat-icon>leak_add</mat-icon>    <mat-icon>leak_remove</mat-icon>    <mat-icon>lens</mat-icon>    <mat-icon>library_add</mat-icon>    <mat-icon>library_books</mat-icon>    <mat-icon>library_music</mat-icon>    <mat-icon>link</mat-icon>    <mat-icon>list</mat-icon>    <mat-icon>live_help</mat-icon>    <mat-icon>live_tv</mat-icon>    <mat-icon>local_activity</mat-icon>    <mat-icon>local_airport</mat-icon>    <mat-icon>local_atm</mat-icon>    <mat-icon>local_bar</mat-icon>    <mat-icon>local_cafe</mat-icon>    <mat-icon>local_car_wash</mat-icon>    <mat-icon>local_convenience_store</mat-icon>    <mat-icon>local_dining</mat-icon>    <mat-icon>local_drink</mat-icon>    <mat-icon>local_florist</mat-icon>    <mat-icon>local_gas_station</mat-icon>    <mat-icon>local_grocery_store</mat-icon>    <mat-icon>local_hospital</mat-icon>    <mat-icon>local_hotel</mat-icon>    <mat-icon>local_laundry_service</mat-icon>    <mat-icon>local_library</mat-icon>    <mat-icon>local_mall</mat-icon>    <mat-icon>local_movies</mat-icon>    <mat-icon>local_offer</mat-icon>    <mat-icon>local_parking</mat-icon>    <mat-icon>local_pharmacy</mat-icon>    <mat-icon>local_phone</mat-icon>    <mat-icon>local_pizza</mat-icon>    <mat-icon>local_play</mat-icon>    <mat-icon>local_post_office</mat-icon>    <mat-icon>local_printshop</mat-icon>    <mat-icon>local_see</mat-icon>    <mat-icon>local_shipping</mat-icon>    <mat-icon>local_taxi</mat-icon>    <mat-icon>location_city</mat-icon>    <mat-icon>location_disabled</mat-icon>    <mat-icon>location_off</mat-icon>    <mat-icon>location_on</mat-icon>    <mat-icon>location_searching</mat-icon>    <mat-icon>lock</mat-icon>    <mat-icon>lock_open</mat-icon>    <mat-icon>lock_outline</mat-icon>    <mat-icon>looks</mat-icon>    <mat-icon>looks_3</mat-icon>    <mat-icon>looks_4</mat-icon>    <mat-icon>looks_5</mat-icon>    <mat-icon>looks_6</mat-icon>    <mat-icon>looks_one</mat-icon>    <mat-icon>looks_two</mat-icon>    <mat-icon>loop</mat-icon>    <mat-icon>loupe</mat-icon>    <mat-icon>loyalty</mat-icon>    <mat-icon>mail</mat-icon>    <mat-icon>map</mat-icon>    <mat-icon>markunread</mat-icon>    <mat-icon>markunread_mailbox</mat-icon>    <mat-icon>memory</mat-icon>    <mat-icon>menu</mat-icon>    <mat-icon>merge_type</mat-icon>    <mat-icon>message</mat-icon>    <mat-icon>mic</mat-icon>    <mat-icon>mic_none</mat-icon>    <mat-icon>mic_off</mat-icon>    <mat-icon>mms</mat-icon>    <mat-icon>mode_comment</mat-icon>    <mat-icon>mode_edit</mat-icon>    <mat-icon>money_off</mat-icon>    <mat-icon>monochrome_photos</mat-icon>    <mat-icon>mood</mat-icon>    <mat-icon>mood_bad</mat-icon>    <mat-icon>more</mat-icon>    <mat-icon>more_horiz</mat-icon>    <mat-icon>more_vert</mat-icon>    <mat-icon>mouse</mat-icon>    <mat-icon>movie</mat-icon>    <mat-icon>movie_creation</mat-icon>    <mat-icon>music_note</mat-icon>    <mat-icon>my_location</mat-icon>    <mat-icon>nature</mat-icon>    <mat-icon>nature_people</mat-icon>    <mat-icon>navigate_before</mat-icon>    <mat-icon>navigate_next</mat-icon>    <mat-icon>navigation</mat-icon>    <mat-icon>network_cell</mat-icon>    <mat-icon>network_locked</mat-icon>    <mat-icon>network_wifi</mat-icon>    <mat-icon>new_releases</mat-icon>    <mat-icon>nfc</mat-icon>    <mat-icon>no_sim</mat-icon>    <mat-icon>not_interested</mat-icon>    <mat-icon>note_add</mat-icon>    <mat-icon>notifications</mat-icon>    <mat-icon>notifications_active</mat-icon>    <mat-icon>notifications_none</mat-icon>    <mat-icon>notifications_off</mat-icon>    <mat-icon>notifications_paused</mat-icon>    <mat-icon>offline_pin</mat-icon>    <mat-icon>ondemand_video</mat-icon>    <mat-icon>open_in_browser</mat-icon>    <mat-icon>open_in_new</mat-icon>    <mat-icon>open_with</mat-icon>    <mat-icon>pages</mat-icon>    <mat-icon>pageview</mat-icon>    <mat-icon>palette</mat-icon>    <mat-icon>panorama</mat-icon>    <mat-icon>panorama_fish_eye</mat-icon>    <mat-icon>panorama_horizontal</mat-icon>    <mat-icon>panorama_vertical</mat-icon>    <mat-icon>panorama_wide_angle</mat-icon>    <mat-icon>party_mode</mat-icon>    <mat-icon>pause</mat-icon>    <mat-icon>pause_circle_filled</mat-icon>    <mat-icon>pause_circle_outline</mat-icon>    <mat-icon>payment</mat-icon>    <mat-icon>people</mat-icon>    <mat-icon>people_outline</mat-icon>    <mat-icon>perm_camera_mic</mat-icon>    <mat-icon>perm_contact_calendar</mat-icon>    <mat-icon>perm_data_setting</mat-icon>    <mat-icon>perm_device_information</mat-icon>    <mat-icon>perm_identity</mat-icon>    <mat-icon>perm_media</mat-icon>    <mat-icon>perm_phone_msg</mat-icon>    <mat-icon>perm_scan_wifi</mat-icon>    <mat-icon>person</mat-icon>    <mat-icon>person_add</mat-icon>    <mat-icon>person_outline</mat-icon>    <mat-icon>person_pin</mat-icon>    <mat-icon>personal_video</mat-icon>    <mat-icon>phone</mat-icon>    <mat-icon>phone_android</mat-icon>    <mat-icon>phone_bluetooth_speaker</mat-icon>    <mat-icon>phone_forwarded</mat-icon>    <mat-icon>phone_in_talk</mat-icon>    <mat-icon>phone_iphone</mat-icon>    <mat-icon>phone_locked</mat-icon>    <mat-icon>phone_missed</mat-icon>    <mat-icon>phone_paused</mat-icon>    <mat-icon>phonelink</mat-icon>    <mat-icon>phonelink_erase</mat-icon>    <mat-icon>phonelink_lock</mat-icon>    <mat-icon>phonelink_off</mat-icon>    <mat-icon>phonelink_ring</mat-icon>    <mat-icon>phonelink_setup</mat-icon>    <mat-icon>photo</mat-icon>    <mat-icon>photo_album</mat-icon>    <mat-icon>photo_camera</mat-icon>    <mat-icon>photo_library</mat-icon>    <mat-icon>photo_size_select_actual</mat-icon>    <mat-icon>photo_size_select_large</mat-icon>    <mat-icon>photo_size_select_small</mat-icon>    <mat-icon>picture_as_pdf</mat-icon>    <mat-icon>picture_in_picture</mat-icon>    <mat-icon>pin_drop</mat-icon>    <mat-icon>place</mat-icon>    <mat-icon>play_arrow</mat-icon>    <mat-icon>play_circle_filled</mat-icon>    <mat-icon>play_circle_outline</mat-icon>    <mat-icon>play_for_work</mat-icon>    <mat-icon>playlist_add</mat-icon>    <mat-icon>plus_one</mat-icon>    <mat-icon>poll</mat-icon>    <mat-icon>polymer</mat-icon>    <mat-icon>portable_wifi_off</mat-icon>    <mat-icon>portrait</mat-icon>    <mat-icon>power</mat-icon>    <mat-icon>power_input</mat-icon>    <mat-icon>power_settings_new</mat-icon>    <mat-icon>present_to_all</mat-icon>    <mat-icon>print</mat-icon>    <mat-icon>public</mat-icon>    <mat-icon>publish</mat-icon>    <mat-icon>query_builder</mat-icon>    <mat-icon>question_answer</mat-icon>    <mat-icon>queue</mat-icon>    <mat-icon>queue_music</mat-icon>    <mat-icon>radio</mat-icon>    <mat-icon>radio_button_checked</mat-icon>    <mat-icon>radio_button_unchecked</mat-icon>    <mat-icon>rate_review</mat-icon>    <mat-icon>receipt</mat-icon>    <mat-icon>recent_actors</mat-icon>    <mat-icon>redeem</mat-icon>    <mat-icon>redo</mat-icon>    <mat-icon>refresh</mat-icon>    <mat-icon>remove</mat-icon>    <mat-icon>remove_circle</mat-icon>    <mat-icon>remove_circle_outline</mat-icon>    <mat-icon>remove_red_eye</mat-icon>    <mat-icon>reorder</mat-icon>    <mat-icon>repeat</mat-icon>    <mat-icon>repeat_one</mat-icon>    <mat-icon>replay</mat-icon>    <mat-icon>replay_10</mat-icon>    <mat-icon>replay_30</mat-icon>    <mat-icon>replay_5</mat-icon>    <mat-icon>reply</mat-icon>    <mat-icon>reply_all</mat-icon>    <mat-icon>report</mat-icon>    <mat-icon>report_problem</mat-icon>    <mat-icon>restaurant_menu</mat-icon>    <mat-icon>restore</mat-icon>    <mat-icon>ring_volume</mat-icon>    <mat-icon>room</mat-icon>    <mat-icon>rotate_90_degrees_ccw</mat-icon>    <mat-icon>rotate_left</mat-icon>    <mat-icon>rotate_right</mat-icon>    <mat-icon>router</mat-icon>    <mat-icon>satellite</mat-icon>    <mat-icon>save</mat-icon>    <mat-icon>scanner</mat-icon>    <mat-icon>schedule</mat-icon>    <mat-icon>school</mat-icon>    <mat-icon>screen_lock_landscape</mat-icon>    <mat-icon>screen_lock_portrait</mat-icon>    <mat-icon>screen_lock_rotation</mat-icon>    <mat-icon>screen_rotation</mat-icon>    <mat-icon>sd_card</mat-icon>    <mat-icon>sd_storage</mat-icon>    <mat-icon>search</mat-icon>    <mat-icon>security</mat-icon>    <mat-icon>select_all</mat-icon>    <mat-icon>send</mat-icon>    <mat-icon>settings</mat-icon>    <mat-icon>settings_applications</mat-icon>    <mat-icon>settings_backup_restore</mat-icon>    <mat-icon>settings_bluetooth</mat-icon>    <mat-icon>settings_brightness</mat-icon>    <mat-icon>settings_cell</mat-icon>    <mat-icon>settings_ethernet</mat-icon>    <mat-icon>settings_input_antenna</mat-icon>    <mat-icon>settings_input_component</mat-icon>    <mat-icon>settings_input_composite</mat-icon>    <mat-icon>settings_input_hdmi</mat-icon>    <mat-icon>settings_input_svideo</mat-icon>    <mat-icon>settings_overscan</mat-icon>    <mat-icon>settings_phone</mat-icon>    <mat-icon>settings_power</mat-icon>    <mat-icon>settings_remote</mat-icon>    <mat-icon>settings_system_daydream</mat-icon>    <mat-icon>settings_voice</mat-icon>    <mat-icon>share</mat-icon>    <mat-icon>shop</mat-icon>    <mat-icon>shop_two</mat-icon>    <mat-icon>shopping_basket</mat-icon>    <mat-icon>shopping_cart</mat-icon>    <mat-icon>shuffle</mat-icon>    <mat-icon>signal_cellular_4_bar</mat-icon>    <mat-icon>signal_cellular_connected_no_internet_4_bar</mat-icon>    <mat-icon>signal_cellular_no_sim</mat-icon>    <mat-icon>signal_cellular_null</mat-icon>    <mat-icon>signal_cellular_off</mat-icon>    <mat-icon>signal_wifi_4_bar</mat-icon>    <mat-icon>signal_wifi_4_bar_lock</mat-icon>    <mat-icon>signal_wifi_off</mat-icon>    <mat-icon>sim_card</mat-icon>    <mat-icon>sim_card_alert</mat-icon>    <mat-icon>skip_next</mat-icon>    <mat-icon>skip_previous</mat-icon>    <mat-icon>slideshow</mat-icon>    <mat-icon>smartphone</mat-icon>    <mat-icon>sms</mat-icon>    <mat-icon>sms_failed</mat-icon>    <mat-icon>snooze</mat-icon>    <mat-icon>sort</mat-icon>    <mat-icon>sort_by_alpha</mat-icon>    <mat-icon>space_bar</mat-icon>    <mat-icon>speaker</mat-icon>    <mat-icon>speaker_group</mat-icon>    <mat-icon>speaker_notes</mat-icon>    <mat-icon>speaker_phone</mat-icon>    <mat-icon>spellcheck</mat-icon>    <mat-icon>star</mat-icon>    <mat-icon>star_border</mat-icon>    <mat-icon>star_half</mat-icon>    <mat-icon>stars</mat-icon>    <mat-icon>stay_current_landscape</mat-icon>    <mat-icon>stay_current_portrait</mat-icon>    <mat-icon>stay_primary_landscape</mat-icon>    <mat-icon>stay_primary_portrait</mat-icon>    <mat-icon>stop</mat-icon>    <mat-icon>storage</mat-icon>    <mat-icon>store</mat-icon>    <mat-icon>store_mall_directory</mat-icon>    <mat-icon>straighten</mat-icon>    <mat-icon>strikethrough_s</mat-icon>    <mat-icon>style</mat-icon>    <mat-icon>subject</mat-icon>    <mat-icon>subtitles</mat-icon>    <mat-icon>supervisor_account</mat-icon>    <mat-icon>surround_sound</mat-icon>    <mat-icon>swap_calls</mat-icon>    <mat-icon>swap_horiz</mat-icon>    <mat-icon>swap_vert</mat-icon>    <mat-icon>swap_vertical_circle</mat-icon>    <mat-icon>switch_camera</mat-icon>    <mat-icon>switch_video</mat-icon>    <mat-icon>sync</mat-icon>    <mat-icon>sync_disabled</mat-icon>    <mat-icon>sync_problem</mat-icon>    <mat-icon>system_update</mat-icon>    <mat-icon>system_update_alt</mat-icon>    <mat-icon>tab</mat-icon>    <mat-icon>tab_unselected</mat-icon>    <mat-icon>tablet</mat-icon>    <mat-icon>tablet_android</mat-icon>    <mat-icon>tablet_mac</mat-icon>    <mat-icon>tag_faces</mat-icon>    <mat-icon>tap_and_play</mat-icon>    <mat-icon>terrain</mat-icon>    <mat-icon>text_format</mat-icon>    <mat-icon>textsms</mat-icon>    <mat-icon>texture</mat-icon>    <mat-icon>theaters</mat-icon>    <mat-icon>thumb_down</mat-icon>    <mat-icon>thumb_up</mat-icon>    <mat-icon>thumbs_up_down</mat-icon>    <mat-icon>time_to_leave</mat-icon>    <mat-icon>timelapse</mat-icon>    <mat-icon>timer</mat-icon>    <mat-icon>timer_10</mat-icon>    <mat-icon>timer_3</mat-icon>    <mat-icon>timer_off</mat-icon>    <mat-icon>toc</mat-icon>    <mat-icon>today</mat-icon>    <mat-icon>toll</mat-icon>    <mat-icon>tonality</mat-icon>    <mat-icon>toys</mat-icon>    <mat-icon>track_changes</mat-icon>    <mat-icon>traffic</mat-icon>    <mat-icon>transform</mat-icon>    <mat-icon>translate</mat-icon>    <mat-icon>trending_down</mat-icon>    <mat-icon>trending_flat</mat-icon>    <mat-icon>trending_up</mat-icon>    <mat-icon>tune</mat-icon>    <mat-icon>turned_in</mat-icon>    <mat-icon>turned_in_not</mat-icon>    <mat-icon>tv</mat-icon>    <mat-icon>undo</mat-icon>    <mat-icon>unfold_less</mat-icon>    <mat-icon>unfold_more</mat-icon>    <mat-icon>usb</mat-icon>    <mat-icon>verified_user</mat-icon>    <mat-icon>vertical_align_bottom</mat-icon>    <mat-icon>vertical_align_center</mat-icon>    <mat-icon>vertical_align_top</mat-icon>    <mat-icon>vibration</mat-icon>    <mat-icon>video_library</mat-icon>    <mat-icon>videocam</mat-icon>    <mat-icon>videocam_off</mat-icon>    <mat-icon>view_agenda</mat-icon>    <mat-icon>view_array</mat-icon>    <mat-icon>view_carousel</mat-icon>    <mat-icon>view_column</mat-icon>    <mat-icon>view_comfy</mat-icon>    <mat-icon>view_compact</mat-icon>    <mat-icon>view_day</mat-icon>    <mat-icon>view_headline</mat-icon>    <mat-icon>view_list</mat-icon>    <mat-icon>view_module</mat-icon>    <mat-icon>view_quilt</mat-icon>    <mat-icon>view_stream</mat-icon>    <mat-icon>view_week</mat-icon>    <mat-icon>vignette</mat-icon>    <mat-icon>visibility</mat-icon>    <mat-icon>visibility_off</mat-icon>    <mat-icon>voice_chat</mat-icon>    <mat-icon>voicemail</mat-icon>    <mat-icon>volume_down</mat-icon>    <mat-icon>volume_mute</mat-icon>    <mat-icon>volume_off</mat-icon>    <mat-icon>volume_up</mat-icon>    <mat-icon>vpn_key</mat-icon>    <mat-icon>vpn_lock</mat-icon>    <mat-icon>wallpaper</mat-icon>    <mat-icon>warning</mat-icon>    <mat-icon>watch</mat-icon>    <mat-icon>wb_auto</mat-icon>    <mat-icon>wb_cloudy</mat-icon>    <mat-icon>wb_incandescent</mat-icon>    <mat-icon>wb_iridescent</mat-icon>    <mat-icon>wb_sunny</mat-icon>    <mat-icon>wc</mat-icon>    <mat-icon>web</mat-icon>    <mat-icon>whatshot</mat-icon>    <mat-icon>widgets</mat-icon>    <mat-icon>wifi</mat-icon>    <mat-icon>wifi_lock</mat-icon>    <mat-icon>wifi_tethering</mat-icon>    <mat-icon>work</mat-icon>    <mat-icon>wrap_text</mat-icon>    <mat-icon>youtube_searched_for</mat-icon>    <mat-icon>zoom_in</mat-icon>    <mat-icon>zoom_out</mat-icon>  </mat-card-content></mat-card></div>'
    var COMPONENTS = [{'name': 'AboutComponent', 'selector': 'app-about'},{'name': 'AdminComponent', 'selector': 'app-admin'},{'name': 'AgeComponent', 'selector': 'analysis-crowd-age'},{'name': 'AmapComponent', 'selector': 'stbui-amap'},{'name': 'AmapComponent', 'selector': 'app-amap'},{'name': 'AppComponent', 'selector': 'app-root'},{'name': 'BarComponent', 'selector': 'stbui-chart-bar'},{'name': 'BaseLayoutComponent', 'selector': 'stbui-base-layout'},{'name': 'BlogComponent', 'selector': 'app-blog'},{'name': 'BrandComponent', 'selector': 'app-brand'},{'name': 'BrandComponent', 'selector': 'analysis-crowd-brand'},{'name': 'ButtonComponent', 'selector': 'stbui-button'},{'name': 'ButtonsComponent', 'selector': 'app-buttons'},{'name': 'CalendarComponent', 'selector': 'app-calendar'},{'name': 'CalendarComponent', 'selector': 'stbui-calendar'},{'name': 'CardsComponent', 'selector': 'app-cards'},{'name': 'ChartComponent', 'selector': 'stbui-chart'},{'name': 'ChatComponent', 'selector': 'app-chat'},{'name': 'ChatsComponent', 'selector': 'app-chats'},{'name': 'ComposeComponent', 'selector': 'app-compose'},{'name': 'ConsumerComponent', 'selector': 'analysis-crowd-consumer'},{'name': 'ContactComponent', 'selector': 'app-contact'},{'name': 'ContactComponent', 'selector': 'app-contact'},{'name': 'ContactUpdateComponent', 'selector': 'stb-contact-upate'},{'name': 'ContactsComponent', 'selector': 'app-contacts'},{'name': 'ContractComponent', 'selector': 'app-contract'},{'name': 'CrmComponent', 'selector': 'app-crm'},{'name': 'CrowdComponent', 'selector': 'app-crowd'},{'name': 'CustomerCommonComponent', 'selector': 'app-customer-common'},{'name': 'CustomerComponent', 'selector': 'app-customer'},{'name': 'CustomizerComponent', 'selector': 'stbui-customizer'},{'name': 'DashboardComponent', 'selector': 'app-dashboard'},{'name': 'DatatableComponent', 'selector': 'app-datatable'},{'name': 'DateDisplayComponent', 'selector': 'stbui-date-display'},{'name': 'DatePickerComponent', 'selector': 'stbui-date-picker'},{'name': 'DatePickerComponent', 'selector': 'app-date-picker'},{'name': 'DayButtonComponent', 'selector': 'stbui-day-button'},{'name': 'DetailComponent', 'selector': 'stb-detail'},{'name': 'DetailComponent', 'selector': 'error-detail,stbui-error-detail,stb-error-detail'},{'name': 'DialogsComponent', 'selector': 'app-dialogs'},{'name': 'DoughnutComponent', 'selector': 'stbui-chart-doughnut'},{'name': 'DynamicComponent', 'selector': 'app-dynamic'},{'name': 'EditorComponent', 'selector': 'app-editor'},{'name': 'ElementsComponent', 'selector': 'app-elements'},{'name': 'EquipmentBrandComponent', 'selector': 'analysis-equipment-brand'},{'name': 'EquipmentComponent', 'selector': 'app-equipment'},{'name': 'ErrorComponent', 'selector': 'app-error'},{'name': 'FileManagerComponent', 'selector': 'stb-file-manager'},{'name': 'FileUploadComponent', 'selector': 'stbui-file-upload'},{'name': 'FooterComponent', 'selector': 'stbui-footer'},{'name': 'FormsComponent', 'selector': 'app-forms'},{'name': 'FullwidthComponent', 'selector': 'app-fullwidth'},{'name': 'GenderComponent', 'selector': 'analysis-crowd-gender'},{'name': 'HeaderComponent', 'selector': 'stbui-header'},{'name': 'HomeComponent', 'selector': 'app-home'},{'name': 'IconComponent', 'selector': 'app-icon'},{'name': 'ItemComponent', 'selector': 'sidenav-item'},{'name': 'LeadComponent', 'selector': 'app-lead'},{'name': 'LineComponent', 'selector': 'stbui-chart-line'},{'name': 'ListComponent', 'selector': 'stb-list'},{'name': 'ListsComponent', 'selector': 'app-lists'},{'name': 'LoadingComponent', 'selector': 'stbui-loading'},{'name': 'MailComponent', 'selector': 'app-mail'},{'name': 'MarkdownComponent', 'selector': 'app-markdown'},{'name': 'MenuComponent', 'selector': 'app-menu'},{'name': 'MonthComponent', 'selector': 'stbui-calendar-month'},{'name': 'NavCollapseComponent', 'selector': 'stbui-nav-collapse'},{'name': 'NavItemComponent', 'selector': 'stbui-nav-item'},{'name': 'NavigationComponent', 'selector': 'app-navigation'},{'name': 'NavigationComponent', 'selector': 'stbui-navigation'},{'name': 'NoticeComponent', 'selector': 'stbui-notice'},{'name': 'NotificationComponent', 'selector': 'stbui-notification'},{'name': 'OperatorsComponent', 'selector': 'analysis-crowd-operators'},{'name': 'OpportunitiesComponent', 'selector': 'app-opportunities'},{'name': 'PagesComponent', 'selector': 'app-pages'},{'name': 'PaginationComponent', 'selector': 'stbui-pagination'},{'name': 'PaginationComponent', 'selector': 'app-pagination'},{'name': 'PerformanceComponent', 'selector': 'app-performance'},{'name': 'PermeabilityComponent', 'selector': 'analysis-crowd-permeability'},{'name': 'PieComponent', 'selector': 'stbui-chart-pie'},{'name': 'PolarComponent', 'selector': 'stbui-chart-polar'},{'name': 'PopoverComponent', 'selector': 'stbui-popover'},{'name': 'PopoverComponent', 'selector': 'app-popover'},{'name': 'PopulationComponent', 'selector': 'app-population'},{'name': 'PreferenceComponent', 'selector': 'app-preference'},{'name': 'PreferenceFieldComponent', 'selector': 'analysis-preference-field'},{'name': 'ProductComponent', 'selector': 'app-product'},{'name': 'ProfileComponent', 'selector': 'app-profile'},{'name': 'ProjectComponent', 'selector': 'stb-project'},{'name': 'RadarComponent', 'selector': 'stbui-chart-radar'},{'name': 'RegionComponent', 'selector': 'analysis-crowd-region'},{'name': 'ScenePortraitComponent', 'selector': 'app-scene-portrait'},{'name': 'SearchComponent', 'selector': 'stbui-search, stb-search'},{'name': 'ServicesComponent', 'selector': 'app-services'},{'name': 'SidenavComponent', 'selector': 'app-sidenav'},{'name': 'SigninComponent', 'selector': 'app-signin'},{'name': 'SignupComponent', 'selector': 'app-signup'},{'name': 'SliderComponent', 'selector': 'app-slider'},{'name': 'StateComponent', 'selector': 'stb-widget-state'},{'name': 'StaticComponent', 'selector': 'app-static'},{'name': 'SwitchComponent', 'selector': 'stb-widget-switch'},{'name': 'TableComponent', 'selector': 'stbui-table'},{'name': 'TablesComponent', 'selector': 'app-tables'},{'name': 'TabsComponent', 'selector': 'app-tabs'},{'name': 'ToastComponent', 'selector': 'app-toast'},{'name': 'TodoComponent', 'selector': 'app-todo'},{'name': 'TodoHeaderComponent', 'selector': 'app-todo-header'},{'name': 'TodoItemComponent', 'selector': 'app-todo-item'},{'name': 'TodoListComponent', 'selector': 'app-todo-list'},{'name': 'TodoSearchComponent', 'selector': 'app-todo-search'},{'name': 'TodoSidenavComponent', 'selector': 'app-todo-sidenav'},{'name': 'TodoToolbarComponent', 'selector': 'app-todo-toolbar'},{'name': 'ToolbarComponent', 'selector': 'stb-toolbar'},{'name': 'ToolbarComponent', 'selector': 'stbui-calendar-toolbar'},{'name': 'ToolbarHelpComponent', 'selector': 'app-toolbar-help'},{'name': 'ToolbarNotificationComponent', 'selector': 'stbui-toolbar-notification'},{'name': 'ToolbarUserComponent', 'selector': 'stbui-toolbar-user'},{'name': 'TooltipsComponent', 'selector': 'app-tooltips'},{'name': 'UserComponent', 'selector': 'app-user'},{'name': 'ValidationComponent', 'selector': 'app-validation'},{'name': 'ViewComponent', 'selector': 'perf-view'}];
    var DIRECTIVES = [{'name': 'ButtonDirective', 'selector': 'button[stbui-button-large],button[stb-button-large],a[stbui-button-large],a[stb-button-large]'},{'name': 'FileUploadDirective', 'selector': '[stbFileUpload],[stbuiFileUpload]'},{'name': 'LoadingDirective', 'selector': '[stbuiLoading]'},{'name': 'NotificationContainerDirective', 'selector': '[notificationContainer]'},{'name': 'PopoverDirective', 'selector': '[stbuiPopover],[popoverTriggerFor]'}];
    var ACTUAL_COMPONENT = {'name': 'IconComponent'};
</script>
<script src="../js/tree.js"></script>










                   </div><div class="search-results">
    <div class="has-results">
        <h1 class="search-results-title"><span class='search-results-count'></span> results matching "<span class='search-query'></span>"</h1>
        <ul class="search-results-list"></ul>
    </div>
    <div class="no-results">
        <h1 class="search-results-title">No results matching "<span class='search-query'></span>"</h1>
    </div>
</div>
</div>
           </div>
       </div>

       <script src="../js/libs/bootstrap-native.js"></script>

       <script src="../js/libs/es6-shim.min.js"></script>
       <script src="../js/libs/EventDispatcher.js"></script>
       <script src="../js/libs/promise.min.js"></script>
       <script src="../js/libs/zepto.min.js"></script>

       <script src="../js/compodoc.js"></script>

       <script>var COMPODOC_CURRENT_PAGE_DEPTH = 1;</script>

       <script src="../js/search/search.js"></script>
       <script src="../js/search/lunr.min.js"></script>
       <script src="../js/search/search-lunr.js"></script>

       <script src="../js/tabs.js"></script>
       <script src="../js/menu.js"></script>
       <script src="../js/libs/prism.js"></script>
       <script src="../js/sourceCode.js"></script>
       <script src="../js/search/search_index.js"></script>

    </body>
</html>
